備忘録的プログラミングリファレンス

bubblesプロパティ

 bubblesプロパティは、エレメントがイベントをバブリングするかどうかを示すプロパティです。bubblesプロパティの値はBool値です。

 イベントのバブリングとは、あるエレメントで発生したイベントがその親エレメントでも発生するかを示します。

親の親エレメント
┃			↑
┃			┃(バブリング)
┃			┃
親エレメント	*イベントが発生
(event.bubbles=true)
┃			↑
┃			┃(バブリング)
┃			┃
エレメント		*イベントが発生
(event.bubbles=true)

 イベントのバブリングは、イベントが親の階層に水中の泡のように上がっていくイメージからバブリングといいます。基本的には、イベントはドキュメントオブジェクトに到達するまで、親から親へとバブルします。

 バブリングされたイベントはイベントハンドラーが設定されたエレメントでトリガーされます。

 エレメントのバブリングはキャンセルすることもできます。キャンセル方法には以下があります。

方法摘要/例
return false;onclick="func_();return false;"
preventDefault()メソッド<a>エレメントのURLをたどる機能など、デフォルトで発生するイベントをキャンセル
stopPropagation()メソッドエレメントのイベントは発生するが親より上の階層のイベントはキャンセル
stopImmediatePropagation()メソッドエレメント内の他のイベントをキャンセル

 読み取り専用です。

Syntax

in JavaScript

返り値はBool型です。

Boolean = event.bubbles;

Values

trueイベントがバブリング
falseバブリングしない

Example

確認ボタンをクリックしてください。以下のHTML,CSS,Scriptコード例が実行されます。