0

私は、ライブ コールがドキュメントを介して泡立つことを認識しており、それが問題を抱えている理由です。

残念ながら、私は要素をバインドするサード パーティのライブラリを使用しており、クリック イベントがそれらの要素にバブリングされないケースを作成したいと考えています。

.click() を eventStopPropogation と組み合わせて使用​​しても問題なく動作しますが、コンテンツの動的な性質のために、ライブ、オン、デリゲートなどを使用する必要があります...ここに私の問題があります。「内側」のdivをクリックしたときに「外側」のクリックが発生しないようにする必要があります。「外側」のハンドラを変更できません。

よろしくお願いします。

http://jsfiddle.net/99zQM/2/

HTML:

<div id="outer">
    outer
    <div id="inner">
        inner
    </div>
</div>

Javascript:

$("#outer").bind('click',function(e){
   alert("outer clicked"); 
});

$("#inner").live('click',function(e){
   alert("inner clicked"); 
});
4

3 に答える 3

3

onバインドされたデリゲートを使用し、クリック ハンドラーouterで呼び出します。これでうまくいくはずです。e.stopPropagation()inner

これを 更新してみてください

$("#outer").bind('click',function(e){
  alert("outer clicked"); 
});

$('#outer').on('click',"#inner",function(e){
  e.stopPropagation();
  alert("inner clicked"); 

});

ここでフィドルを更新しました

于 2013-03-05T09:26:26.707 に答える
0

すでに述べたように、イベントの委任は、イベントのバブリングと静的要素の使用に依存します。<div id="inner">と要素の間に何もないため、問題は複雑ですが<div id="outer">、それを回避することはできます。

にバインドされている要素のclickイベントに動的イベントハンドラーを設定し、他のイベントハンドラーが実行されないように呼び出します。欠点は、これがイベントハンドラーがバインドされる順序に依存するため、の委任されたイベントハンドラーは、の静的イベントハンドラーの前にバインドする必要があることです。#inner#outerevent.stopImmediatePropagation()#inner#outer

$('#outer').on('click', '#inner', function(e) {
    console.log('inner');
    e.stopImmediatePropagation();
}).click(function(e) {
    console.log('outer');  
});

このjsFiddleデモをご覧ください。

于 2013-03-05T09:29:49.617 に答える
0

使えます

$("#outer").bind('click',function(e){
   alert("outer clicked"); 
});
$('#outer').on('click',"#inner",function(e){
    e.stopImmediatePropagation();
    alert("inner clicked"); 

});
于 2013-03-05T09:44:52.737 に答える