删除页面 URL 中的哈希值并阻止页面滚动到锚点哈希值

时间:2021-06-29 22:57:14

标签: javascript jquery

我有两个页面,index.html 和 result.html。在 index.html 上,我在导航中有一些锚点,当点击它们时,它们会向我的页面 Url 添加一个哈希值,并将 Url 更改为此,例如:

https://example.com/index.html?SessionGuid=0edc696e-6f58-4d54-92c9-3753f5db57ae#someAnchor

在这个页面中,有一个带有提交按钮的表单,当点击提交按钮时,表单值被发送到 result.html。这会导致跳转到页面中间,而不是显示页面顶部。

这是我的 result.html 页面 URL 的样子:

https://example.com/result.html?SessionGuid=0edc696e-6f58-4d54-92c9-3753f5db57ae#someAnchor

因此,我使用此方法删除了 result.html 上的哈希:

history.replaceState('', document.title, window.location.origin + window.location.pathname + window.location.search);

这在 Chrome 中完美运行,哈希值被删除,页面保持在顶部。但在 FireFox 中,哈希值已被删除,但页面仍在滚动到哈希值位置。

在这种行为方面,FF 和 Chrome 有什么区别?有没有跨浏览器的解决方案来解决这个问题?是不是脚本所在的位置?我对 jQuery 或纯 JS 持开放态度。还打开以在 index.html 中登顶表单之前删除散列。无论哪个是跨浏览器兼容的。

0 个答案:

没有答案