JQuery .on ("Klick") löst "Mouseover" auf Touch-Gerät aus

Question

Ich stoße auf unerwünschtes Verhalten, wenn ich JQuerys $.on("click", function(){}); on-Touch-Geräte verwende. Dies ist mein Code unten:

Code:

$(".team").on("mouseover", teamMouseOver); 
$(".team").on("mouseout", teamMouseOut); 
$(".team").on("click", teamThumbClicked); 

function teamMouseOver(event){ 
    console.log(event.type); 
} 

function teamMouseOut(event){ 
    // Do something 
} 

function teamThumbClicked(event){ 
    console.log("Clicked!"); 
} 

Problem:

Mit dem obigen Code, löst gleichzeitig beiden Zuhörer auf einem Touch-Gerät auf ein .team Element tippen, mir geben das folgende Konsolenprotokoll:

mouseover 
Clicked! 

Frage Warum wird mouseover auf einem Touch-Gerät ausgelöst? Dies ist nicht das Verhalten, das ich von einem Gerät ohne Maus erwarten würde. Ist das ein Fehler? Welches Ereignis sollte ich verwenden, damit "Mouseover" nur ausgelöst wird, wenn ein tatsächlicher Mauszeiger eingeht?

Meine JQuery-Version ist 2.2.4.

Answer 1

Ich lief gerade in das gleiche Problem und das ist, was ich getan habe, um das Problem zu lösen.

$('#myEl').on('click', myElClickEvent); 

$('#myEl').on('mouseenter', myElMouseEnterEvent); 

function myElClickEvent (event) { 
    $(this).addClass('Clicked'); 
} 

function myElMouseEnterEvent() { 
    // Turn off events 
    $('#myEl').off(); 

    // After 100 milliseconds cut on events, notice click event won't trigger 
    setTimeout(function() { 
     // .off() is used to prevent from adding multiple click events if the user hovers multiple elements too quickly. 
     $('#myEl').off().on('click', myElClickEvent);    
     $('#myEl').off().on('mouseenter', myElMouseEnterEvent); 
    }, 100); 


    // Do some mouseenter stuff, whatever the reqs. are. 
} 

Dies ist, was ich getan habe und es funktionierte gut für meinen Anwendungsfall. Hoffentlich hilft das jemandem in der Zukunft. Die Idee besteht darin, das Klickereignis innerhalb des Mauseingabeereignisses zu deaktivieren und dann nach 100 Millisekunden das Mausklickereignis wieder einzuschalten. Dies verhindert, dass beide Ereignisse bei Berührung ausgelöst werden.