无需使用 <a href=" "> 重新加载页面即可更改 URL

Question

要在不重新加载页面的情况下修改 URL，我们可以使用：

window.history.pushState('page2', 'Title', '/page2.php');

但如果我用<a>element试试：

<a onClick='my_function()' href='/page2.php'> Click Here </a>
<script>
function my_fnuction(){
    window.history.pushState('page2', 'Title', '/page2.php');

}
 </script>

它不起作用，那么我怎样才能使用<a> element 和window.history.pushState()一起呢？像twitter和Facebook一样，用户可以点击右键在新窗口中打开网址，直接点击获取页面和更改网址，无需重新加载

Answer 1

1. 在 onclick 中，您拥有my_function实际函数名称的位置my_fnuction。

2. 您需要取消默认行为，如果您的 onclick 函数返回 false，则默认浏览器行为将被取消。

代码：

<a onClick='return my_function()' href='/page2.php'> Click Here </a>
<script>
function my_function(){
    window.history.pushState('page2', 'Title', '/page2.php');
    return false;
}
 </script>