如果touchmove fires,取消touchend

Question

我正在构建一些主要用于平板电脑的东西,用户可以点击屏幕上的项目并应用它.这是我到目前为止:

问题:

1. 我想使用触摸事件来删除类并在触摸端添加类(以使其更快).
2. 如果用户滑动(touchmoves),我不希望它做任何事情.

我尝试过很多东西,但都没有.我尝试过的最简单的(失败的)是这样的:

var dragging = false;

$(".items").on("touchmove", function(){
      dragging = true;
});

$('.items').on("click touchend", function(event){
    if (dragging = true){
    }
    else{
    $('.items').removeClass('selected');
    $(this).addClass('selected');
    }
});

Answer 1

我认为这是一种更安全的方式

将变量设置为false

var dragging = false;

将var设置为true ontouchmove(允许您在应用程序的任何位置重复使用此代码)

$("body").on("touchmove", function(){
  dragging = true;
});

你的按钮

$("#button").on("touchend", function(){
      if (dragging)
      return;

      // your button action code
});

重置变量(重要)

$("body").on("touchstart", function(){
    dragging = false;
});

Answer 2

您想要使用以下任一项:

if(dragging == true)

或者,简单地说:

if(dragging)

=在设置值时,您应该只使用单个符号,而==在检查值时应使用两个符号.因此,您的代码应如下所示:

$('.items').on("click touchend", function(event){
    if(!dragging)
    {
        $('.items').removeClass('selected');
        $(this).addClass('selected');
    }
});

请注意,dragging == true在这种情况下,您不需要检查是否因为您没有运行任何代码.相反,你可以简单地检查是否dragging == false,!dragging