説明: イベントが DOM ツリーにバブルアップするのを防ぎます。つまり、先行要素のイベント ハンドラーがトリガーされません。
追加バージョン: 1.0
event.stopPropagation()
event.isPropagationStopped() を使用して、このメソッドが (そのイベント オブジェクト上で) 呼び出されたかどうかを判断できます。
このメソッドは、trigger() によってトリガーされるカスタム イベントにも有効です。
これによって、同じ要素上の他のイベント ハンドラーの実行が妨げられるわけではないことに注意してください。
追加メモ:
.live() メソッドはイベントがドキュメントの先頭に伝播すると処理するため、ライブ イベントの伝播を停止することはできません。同様に、.delegate() イベントは常に、含まれている委任された要素に伝播され、委任されたイベントが呼び出されたときに要素上のイベントが実行されます。
例:
クリック イベントのバブリングを停止します。
$("p").click( function(event ){
event.stopPropagation();
// 何かをする
});
重要なことは記録することです予防イベントバブル。
div にはクリック イベントが追加されており、div 内の img にもクリック イベントが追加されているため、img がクリックされると、最初に img の click イベントがトリガーされ、次にクリックがトリガーされます。 div 上のイベントがトリガーされます。これはイベントバブリングです。
Jquery で彼を簡単に止めることができます。
次のように
event.stopPropagation() ;
このようにすると、画像をクリックしても div のクリック イベントがトリガーされなくなります
$('div').click(function(){
var $div = $(this);
if($div.find(' img').size() > 0){
return;
}else{
$div.css('backgroundColor','#e1f0f3');
$('
').
appendTo($(this)).click(function) (イベント){
$div .css('backgroundColor','#ffffff');
$(this).remove();
event.stopPropagation(); ('margin-left','10px ')
}
});