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

本文介绍了如果在移动设备上滚动，请阻止点击链接的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有很长的用户可以滚动的垂直链接列表，如果用户滚动，我需要防止在此链接上触发点击事件（触摸）。

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

.net / z_acharki / jnwrc5ay / 132 /rel =nofollow>工作小提琴

我们可以在这种情况下使用一个标记防止在滚动过程中点击事件并在滚动停止后启用它。

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

  var disable_click_flag = false; 
 $ b $（window）.scroll（function（）{
 disable_click_flag = true; 
 
 clearTimeout（$。data（this，'scrollTimer'））; 
 
。.data（this，'scrollTimer'，setTimeout（function（）{
 disable_click_flag = false; 
}，250））; 
}）; （click，a，function（e）{
 if（disable_click_flag）{
 e.preventDefault（）; 
 $（body）。 b $ b} 
}）;

希望这有助于您。

I have long vertical list of links that user can scroll through, and I need to prevent triggering a click event (touch) on this links if user scrolls.

In current scenario, when user start scrolling by tapping over the link, it also triggers a click on link. Which is obviously bad. So, is there any way to prevent such a behavior?

解决方案

Working fiddle

We could use a flag in this case to prevent click event just during the scroll and enable it after the scroll stop.

To listen on scroll stop you could use jQuery’s data method that gives us the ability to associate arbitrary data with DOM nodes and using setTimeout() function that will check every 250ms if the user still trigger the scroll, and if not it will change the flag :

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();
    }
});

Hope this helps.