Annulla touchend se touchmove spara

Question

Sto costruendo qualcosa principalmente per l'utilizzo su tablet, in cui l'utente può toccare un elemento sullo schermo e viene applicata una classe. Questo è quello che ho finora:

I problemi:

1. voglio usare eventi di tocco per rimuovere la classe e aggiungere la classe in testa tocco (per renderlo più veloce).
2. Non voglio che faccia nulla se l'utente scorre (touchmoves).

Ho provato un certo numero di cose, nessuna delle quali ha funzionato. Il più semplice che ho provato (senza successo) è questo:

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

Direi questo è un modo più sicuro di farlo

variabile Impostare su false

var dragging = false; 

Impostazione var true ontouchmove (consente di riutilizzare il codice ovunque in la tua app)

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

Il tuo pulsante

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

     // your button action code 
}); 

Ripristino variabile (importante)

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

Answer 2

si desidera utilizzare una delle seguenti operazioni:

if(dragging == true) 

Oppure, semplicemente:

if(dragging) 

Si dovrebbe utilizzare solo un singolo segno = quando si è l'impostazione un valore, mentre due segni == devono essere utilizzati quando controllo un valore. Pertanto, il codice dovrebbe essere simile:

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

Si noti come non c'è bisogno di controllare se dragging == true perché non si esegue alcun codice in questo caso. Invece si può semplicemente verificare se dragging == false o, !dragging

Answer 3

in cui è stato il trascinamento di controllo messo

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

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

sarà resettarlo sul rilascio

Anche attenzione per doppia invita gli eventi come a volte innescano due volte su alcune piattaforme migliori per controllare la piattaforma con il primo aiuto per i controlli

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

o

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