Question

假设我的网页为http://localhost/myApp/route/index.html

如果我点击：

  <li><a href="#secondpage">go to second page</a></li>

它会在不重新加载的情况下将路线更改为http://localhost/myApp/route/index.html#/secondpage。

现在我正在尝试做同样的事情，但只需使用onclick和javascript而不是锚标记。因为在让角度路由器更改为另一个模板之前，我需要先做一些事情。

  <li><a onClick="myFunction()">Payroll Run History</a></li>

  myFunction(){
      [... do stuff ...]
      //change to http://localhost/myApp/route/index.html#/secondpage   without reloading page
  }

Answer 1

设置锚属性：

location.hash = "#/secondpage";

Answer 2

首先，不要使用onclick属性，浏览器和弹出窗口阻止程序不喜欢它。为元素提供ID并在JavaScript中创建事件监听器。

＆＃13;

document.getElementById('my_link').addEventListener("click", function(event) {
  // Prevent defualt action of event:
  event.preventDefault();

  // Do your extra stuff here...
 
  location.hash = event.target.getAttribute('href').substr(1);
});

＆＃13;

<a href="#/secondpage" id="my_link">Click here</a>

＆＃13;

Answer 3

如果您要导航到第二页而不是页面的一部分..您可以使用window.location

这是一个例子

document.getElementById('click').onclick=function(){
var div=document.createElement('div');
div.innerHTML='I just append this div before changing my location';
document.body.appendChild(div);
window.location='http://www.google.com';
}

#click:hover{
  cursor:pointer;
}

<li id='click'>Click here</li>

您会注意到我在body标签中添加了div，然后更改了我的位置....

Answer 4

window.location.hash = "secondpage";

它会在网址中设置#secondpage，并会滚动到该ID。

javascript相当于anchor href

4 个答案: