Отмена touchend, если touchmove срабатывает

Я создаю что-то в основном для использования на планшетах, где пользователь может нажать элемент на экране, и к нему применяется класс. Это то, что у меня есть до сих пор:

проблемы:

  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');
    }
});
7
click javascript jquery touch-event touchmove

3 ответов

Я бы сказал, что это более безопасный способ сделать это

установка переменной в 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;
});
18

вы хотите использовать одно из следующих:

if(dragging == true)

или просто:

if(dragging)

вы должны использовать только один = знак, когда вы задание значение, тогда как два == знаки следует использовать, когда проверка значение. Поэтому ваш код должен выглядеть так:

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

обратите внимание, как вам не нужно проверять, если dragging == true потому что в этом случае вы не используете код. Вместо этого вы можете просто проверить, если dragging == false или, !dragging

7

где у вас есть перетаскивание check put 

if (dragging == true){
   dragging = false;
}

else{
$('.items').removeClass('selected');
$(this).addClass('selected');
}

он сбросит его при выпуске

также следите за двойными вызовами на события, как они иногда срабатывают дважды на некоторых платформах лучше всего проверить платформу с первым следующее поможет с проверками

var clickEventType=((document.ontouchstart!==null)?'click':'touchend');

или

var clickEventType = 'touchend';
if(document.ontouchstart!==null)
{
     clickEventType = 'click';
}
0