单击 anchor 书签会触发滚动事件。
如何仅在用户滚动时触发回调,而不是在点击书签链接时触发回调?
注意: a poorly worded question答案已关闭,但我相信它对社区仍然有用,因为我没有在 StackOverflow 上看到类似问题的答案
最佳答案
Shomz 解决方案依赖于文档滚动上下文中的 anchor 元素。如果元素不在文档的滚动上下文中,则偏移检查可能会失败:
<body>
<div style="max-height: 200px; overflow: auto">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<a name="myanchor">anchor</a>
</body>
我认为还有其他解决方案:
去抖
检测何时单击 anchor 链接 (hashchange
/onclick
) 并消除 scroll
事件。
var debounce = false;
window.addEventListener("hashchange", function () { // also add one for `onclick`
debounce = true;
setTimeout(function () {
debounce = false;
}, 1);
});
window.addEventListener("scroll", function () {
if (debounce) {
return;
}
// .. handle scroll
});
轮子
根据您在导航到 anchor 时不想触发滚动处理程序的具体原因,您可以考虑仅将其附加到 onwheel
事件。这意味着其他滚动方式(触摸、 anchor 、箭头键、Page Down 等)不会触发您的处理程序。
关于javascript - 单击 anchor 书签时防止滚动事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35433475/