javascript - 如果在移动设备上滚动，则防止点击链接

Question

我有很长的垂直链接列表，用户可以滚动浏览这些链接，我需要防止在用户滚动时触发此链接上的 click 事件(触摸)。

在当前情况下，当用户通过点击链接开始滚动时，它还会触发对链接的点击。这显然很糟糕。那么，有什么办法可以防止这种行为吗？

Answer 1

Working fiddle

在这种情况下，我们可以使用一个标志来阻止滚动期间的 click 事件，并在滚动停止后启用它。

要监听滚动停止，您可以使用 jQuery 的数据方法，它使我们能够将任意数据与 DOM 节点相关联，并使用 setTimeout() 函数来检查每 250ms 如果用户仍然触发滚动，如果没有，它将更改标志:

var disable_click_flag = false;

$(window).scroll(function() {
    disable_click_flag = true;

    clearTimeout($.data(this, 'scrollTimer'));

    $.data(this, 'scrollTimer', setTimeout(function() {
        disable_click_flag = false;
    }, 250));
});

$("body").on("click", "a", function(e) {
    if( disable_click_flag ){
        e.preventDefault();
    }
});

希望这对您有所帮助。