1

イベントが添付された親要素とmouse upmouse downイベントが添付された子要素がありclickます。

親でイベントがトリガーされたclick後、子でイベントが発生しないようにする方法はありますか?mouseup

たとえば、JSfiddle hereでは、クリックしても内側の四角形が緑色にならないようにすることが目標です。

理想的には、を変更せずに実行したいと思います$('#inner').on('click', function(){})mouseupブール値をオンにしてチェックできることはすでに知っていclickますが、クリックイベントを変更せずにそれを行う方法を見つけようとしています。

clickjquery(または他のライブラリ)の使用はオプションであり、メソッドを変更しないこと以外に制限はありません。

編集

提案してくれた@adeneoに感謝します。それは有望に見えますが、問題の大部分を見逃していることに気づきました。内部mouseupでは、クリックを防止する必要があるかどうかを確認するための条件付きチェックがあります。イベントを削除した場合、クリックが回避された後にどうにかして元に戻すことはできますか? setTimeoutたとえば。click削除された関数への参照を取得してから、ハンドラーを再度追加する方法 (または可能かどうか) がわかりません。

ここにあるこの新しいフィドルが、もう少しうまく説明するのに役立つことを願っています!

4

4 に答える 4

0

コードを以下のコードに置き換えて確認してください。内側の div のクリック イベントを停止するには、 preventDefault() または stopPropagation() を使用できます。以下をご確認ください

 $('#inner').on('click', function(e) {      
     $(this).stopPropagation();
    // or
    // $(this).preventDefault();
    alert('inner click');
});

$('#outer').on('mousedown', function(e) {
    $(this).css({'background': 'green'});
});

$('#outer').on('mouseup', function(e) {
    $(this).css({'background': 'yellow'});


});
于 2013-09-30T12:01:15.323 に答える
0
$('#inner').on('mouseup', function(e) {    
        $(this).unbind("click");
        $(this).css({'background': 'black'});    
});

このようにしてみましたか?

于 2013-09-30T11:50:39.477 に答える
0

e.stopImmediatePropagation(); を試してください。あなたの内部コードで。

于 2013-09-30T11:52:43.000 に答える