如果在移动设备上滚动,请阻止点击链接

Question

我有很长的用户可以滚动的垂直链接列表,如果用户滚动,我需要阻止click在此链接上触发事件(触摸).

在当前场景中,当用户通过点击链接开始滚动时,它还会触发clickon链接.这显然很糟糕.那么,有什么办法可以阻止这种行为吗？

Answer 1

工作小提琴

在这种情况下,我们可以使用一个标志来阻止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();
    }
});

希望这可以帮助.