モバイルで2回発砲するタッチスタート

Question

モバイルメニューに問題があります。最初に私は私のコードをアップロードし、クリック機能が働いていなかったアンドロイドのクロムを経由して私のモバイルデバイス上で確認した後にデスクトップ

$('#nav-icon3').click(function(){ 
    $(this).toggleClass('open'); 
}); 

$('.menu-item').click(function(){ 
    $('#nav-icon3').toggleClass('open'); 
}); 

にうまく働いている。このように書かれていたので、私はtouchstartを使用してみました。

$('#nav-icon3').on('touchstart', function(){ 
    $(this).toggleClass('open'); 
}); 

$('.menu-item').on('click touchstart', function(){ 
    $('#nav-icon3').toggleClass('open'); 
}); 

メニュー項目の要素に触れると、トグルが2回発生します。とにかく私はこれが起こるのを防ぐことができ、一度だけ発火させることができますか？

Answer 1

あなたの質問に基づいて何が起こっているかは、あなたのイベントが伝播していると思います。あなたができることは、このようなことをしてイベントが伝播するのを止めることです。ここ

$('.menu-item').on('click touchstart', function(e) { 
    e.stopPropagation(); 
    $('#nav-icon3').toggleClass('open'); 
}); 

詳細参照：

https://api.jquery.com/event.stoppropagation/