#96 stopPropagation()の必要性

よくあるmodalを作っていた。モーダルの中で拡大機能をつけようと、expandボタンを追加して押してみたら、モーダル自体が閉じてしまう現象が発生して、どうしたものかと、ためしにstopPropagation();をつけてみたら、無事に拡大できた。

これがイベントの伝播ってやつか。今まで情報としては知っていたけれど、実際にはじめて遭遇したので、メモしておく。

拡大機能の外側にあった、モーダル背景の閉じる機能が伝搬して動いてしまったのが要因。

デモ：8行目のe.stopPropagation();の先頭に//をつけると拡大機能が閉じる機能になる。（デフォはコメントにしてないから正しく動いている）

参考：イベントが発生すると、まずいちばん外側のWindowオブジェクトからターゲットまでキャプチャリングフェーズがあって、次にターゲットフェーズが来て、最後にバブリングフェーズで遡っていくとのこと。JSこんなことやってたのか。。。

イベントの伝搬(キャプチャリングとバブリング)

stopPropagation()について　つかいどころがいまいち分からないが、stopImmediatePropagetionというものもあるのか

イベントの伝搬をキャンセルする(stopPropagation,stopImmediatePropagation)

これらの記事 Java Driveは、ちょくちょく参考にさせていただいているけど、作者さんの名前ずっとタラオイクラだと思ってたら違ってた。。