移动端正在从URL中移除哈希/锚点。如何阻止这种情况?

当我在桌面端点击带有锚点的链接时,页面会滚动到相应位置。然而在移动端(Android 上的 Firefox 和 Chrome)中,锚点会被从 URL 中移除,因此无法滚动到指定位置。

我想要实现的目标:

我们有一份较长的指南和常见问题解答文档,需要链接到各个标题。由于 Discourse 会移除 id 参数,我创建了一个简单的主题组件,该组件使用目标文档中的自定义数据属性,并监听 URL 中的锚点,以便滚动到具有匹配数据属性的元素。

它在桌面端可以正常工作!

然而在移动端,锚点似乎被移除了,因此当你到达目标页面时,不会滚动到正确的元素。当然,对于长文档来说,移动端是最需要这种导航功能的。

我发现,由目录组件生成的锚点在通过新链接打开时是有效的。它们不会从 URL 中被移除,浏览器也会滚动到正确的位置。

我该如何解决这个问题?


(吐槽:尝试实现 HTML 中如此基本且核心的功能——即使用锚点并链接到它们——真的令人沮丧。我意识到,由于帖子是用户生成的内容,因此存在安全问题。但感觉为了防止滥用而实施的解决方案过于粗暴,使得原本简单的操作变得非常复杂。话说回来,我的网站从未被黑客攻击过,所以这也许算是一件好事吧。)

小更新……

有人建议改用查询参数。这些参数在移动端似乎不会被移除。但令人惊讶的是,在桌面端它们会被移除。