ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery がイベントのバブルアップを防ぐ方法
条件:外側の層にDIV要素があり、内側の層にP要素があり、DIVがP要素の親要素、Pが外側のDIVの子要素であるという関係があります。それらの間に含まれることと含まれること。
イベント: ここで、クリック イベントなどの同じイベントを両方の要素にバインドします。
結果: このとき、内側の P タグをクリックすると、内側の要素のクリック イベントがトリガーされ、外側の DIV のクリック イベントもトリガーされます。
JQuery は、イベントのバブリングを防ぐ 3 つの方法を提供します。
メソッド 1:event.stopPropagation();
メソッド 2:event.preventDefault();
メソッド 3:return false;
違い:event.stopPropagation() はイベントのバブルアップを防止するだけであり、防止はしませんイベントそのもの。 event.preventDefault() はイベント自体を阻止するだけであり、イベントのバブルアップは阻止しません。 false を返すと、イベントのバブルアップが阻止されるだけでなく、イベント自体も阻止されます。