Question

我在我的URL中使用锚点作为JavaScript的一种变量，例如：

mysite.com/itempage.html#item75

当我点击任何其他页面上的链接时，这是有效的，但不是在有问题的实际页面上（itempage.html）。

不是重新加载页面，而是单击链接只会更改URL。由于页面没有重新加载，我的JavaScript都没有再次运行。

有没有人知道用新网址重新加载网页的方法？

到目前为止，我已经尝试过：

HTML

<div id="itemmenu">
  <a id="item75" href="#">Item 75</a>
  <a id="item11" href="#">Item 11</a>
</div>

JQUERY

$( "#itemmenu a" ).each(function(index) { 
    $(this).on("click", function(){
        var linkid = $(this).attr('id'); 
        var winloc = "mysite.com/itempage#" + linkid;
        window.location  = winloc;
    });
});

Answer 1

这确实是预期的行为：不重新加载页面，只是将页面滚动到锚点。此外，“＃...”部分纯粹发生在客户端，浏览器不会将这部分URI发送到服务器，因此：

被认为是服务器的相同URI。

如果您需要重新加载页面，您可以执行以下操作：

<div id="itemmenu">
  <a id="item75" href="?item=75">Item 75</a>
  <a id="item11" href="?item=11">Item 11</a>
</div>

如果您不需要重新加载页面，只需重新运行JavaScript ，请将所需的JavaScript函数与任何相关链接上的click事件相关联。

附加说明：

$(this).on("click", ...)可缩短为$(this).click(...)。
您不需要实际的JavaScript代码：直接在HTML代码中设置href，而不是通过JavaScript更改它们。

Answer 2

您实际上可以使用window.location.reload()触发页面重新加载，但我会反对它。

而是在此处触发页面呈现所需的所有必要代码。

即。

function setupPageLayout() {
  // TODO: add any code that's supposed to run on page switch
}

$(document).on('load', setupPageLayout);

$('#itemmenu a').each(function(index) { 
  $(this).on("click", function(){
    setupPageLayout();
  });
});

链接应如下所示：

<a href="#item34">item</a>

使用Javascript或Jquery使用锚重新加载页面

2 个答案: