たとえば、上のページでは、
は 3 つの層に分割されています。divOne は外側の層、divTwo は中間の層、hr_three は最も内側の層です。
これらはすべてです。独自のクリック イベントがあり、最も内側の a タグにも href 属性があります。
ページを実行し、[クリックしてください] をクリックすると、次の順にポップアップ表示されます: 私は最も内側の層です--->私は中間層です--->私は最も外側の層です-- -->その後、Baidu にリンクします。
これはイベント バブリングです。最初は、ID hr_three のラベルをクリックしただけですが、実際に 3 つのアラート操作が実行されました。
イベントバブリングプロセス(タグIDで示される): hr_three---->divTwo---->divOne。最内層から最外層へ泡立ちます。

停止方法
1.event.stopPropagation();

2.returnfalse;
次のコードが先頭に追加された場合

$(function() {
$("#hr_three").click(function(event){
returnfalse;
}); 🎜>もう一度 [クリックしてください] をクリックすると、ポップアップが表示されます: 私は最も内側の層ですが、Baidu ページへのリンクは実行しません


ここから
がわかります。 :
1.event.stopPropagation();

イベントのバブリングを防ぎますが、デフォルトの動作はブロックしません (ハイパーリンクのジャンプは実行されます)
2.returnfalse; >イベント処理中に、イベントのバブリングを防ぎ、デフォルトの動作もブロックします (たとえば、今はハイパーリンクのジャンプが実行されませんでした)
バブリングに関連するものはもう 1 つあります:
3 .event.preventDefault(); ヘッダーAタグのクリックに入れる場合 イベント内の「Click Me」をクリックします。 「私は最内層です」→「私は中間層です」→「私は最外層です」と次々と出てくるのですが、結局Baiduにはジャンプしません。
機能 はい: イベント処理中、イベントのバブリングはブロックされませんが、デフォルトの動作はブロックされます (すべてのポップアップ ボックスのみが実行され、ハイパーリンク ジャンプは実行されません)。