33

次のスニペットを検討してください。

<div class="div-outer">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    <div class="div-inner" style="background:red">
        Curabitur hendrerit vehicula erat, ut gravida orci luctus vitae.
    </div>
</div>

ここで、外側の div にライブがclick関連付けられているとします。インナーのどこにいてもライブclickがトリガーされないようにするにはどうすればよいですか?clickdiv

編集：

要求されたJSは次のとおりです

$(".div-outer").live("click",function(){alert("hi")});

これは、「.inner-div」をクリックしたときにトリガーされるべきではありません

4

5 に答える 5

38

インナーチャイルドにイベントリスナーを追加し、イベントの伝播をキャンセルする必要があります。

プレーンJSでは次のようなもの

document.getElementById('inner').addEventListener('click',function (event){
   event.stopPropagation();
});

十分なものです。jQueryは同じ機能を提供することに注意してください：

$(".inner-div").click(function(event){
    event.stopPropagation();
});

また

$(".inner-inner").on('click',function(event){
    event.stopPropagation();
});
于 2012-12-03T11:40:37.040 に答える
1

これを行うには、内側の div にクリック イベントを追加し、またはのいずれreturn false;かを使用します。event.stopPropagation();

$(".div-inner").click(function(){

  return false;
})

また

$(".div-inner").click(function(event){

  event.stopPropagation();
})

jsフィドル

于 2012-12-03T11:41:14.500 に答える
1

click内部 div の新しいリスナーを作成event.stopPropagation()し、その新しいイベントで を呼び出します。

お気に入り

$('div-outer').on('click','div-inner',function(e){
    e.stopPropagation();
});
于 2012-12-03T11:42:04.890 に答える