Question

我正在采用@Old Pro的回答：

history.replaceState({}, '', window.location.href.substring(0, window.location.href.indexOf('#')))

我的目标是：

从第1页重定向到第2页并跳转到锚#DivTgt
重定向后，将从网址中删除#DivTgt。因此URL会只显示page2.php而不是page2.php #DivTgt

@Old Pro的方法适用于Firefox，但不适用于Chrome / Safari。对于Chrome / Safari，它会重定向和#DivTgt删除，但不会跳转到锚定#DivTgt。 @Old Pro的方法插在第2页（目标页面）上。

我已尝试过replaceState和pushState，两者都返回相同的结果（即仅适用于Firefox）

我有没有想念。

Answer 1

首先，我建议将您的JavaScript代码移动到.ready（）函数中。否则，当DOM尚未准备好时，可能会调用您的代码。

我不能告诉你为什么它不起作用，但显然由于没有明确的规格，新的html5推送和替换状态功能存在一些问题。请阅读：history.replaceState() example?

所以为了帮助你，我可以提出一个解决方法。保持你的推/替状态功能，并用javascript强制滚动到你的锚点。

你能看看我的例子吗？ http://francoisjeunesse.be/example/page1.php

page1.php中：

<a href="page2.php#DivTgt">Go to Page 2</a>

使page2.php：

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js" ></script>
<script type="text/javascript"> 
$( document ).ready(function() {
    if (window.location.href.indexOf('#DivTgt') != -1){
        document.getElementById("DivTgt").scrollIntoView(true);
    }
    history.pushState({}, '', window.location.href.substring(0, window.location.href.indexOf('#')));

});
</script>
</head>
<body>
<div style="border:1px solid #000;min-height:1000px">spacer</div>
<a id="DivTgt" name="DivTgt"/>anchor is here</a>
</body>
</html>

隐藏URL中的锚标记[Ref：Rails隐藏URL中的#anchor标记]

1 个答案: