event.stopPropagation() とevent.preventDefault() の間の接続

目次

イベントバブリングの防止、デフォルトイベントの防止、event.stopPropagation()とevent.preventDefault()の違い、falseを返す

---

今日は、フロントエンドのバブリングイベントとイベントのデフォルトイベントがどのように処理されるかを見てみましょう。

1.event.stopPropagation()メソッド

これは、イベントのバブリングを防ぎ、イベントがドキュメントに広がるのを防ぐ方法ですが、デフォルトのイベントは引き続き実行されます。この方法を使用する場合、接続をクリックすると、接続は引き続き開かれます。

2.event.preventDefault()メソッド

これはデフォルトイベントを防ぐためのメソッドで、このメソッドを呼び出すと接続は開かれませんがバブリングが発生し、そのバブリングが前の階層の親要素に渡されます。

3. false を返します ；

この方法はより暴力的です。イベントのバブリングとデフォルト イベントを同時に防ぎます。このコードを書くと、接続は開かれず、イベントは前の層の親要素に渡されません。理解できます。 falseを返すのは、event.stopPropagation()とevent.preventDefault()を同時に呼び出したときと同じです。

4. DOM 操作に jquery を使用したいくつかのグループのデモを見てみましょう

 最初の js コードを見てみましょう。

2 番目のタイプ:

 

3 番目のタイプ:

 event.stopPropagation() およびevent.preventDefault() を実行し、false を返します。

 4 番目のタイプ:

5 番目のタイプ: