質問: ### 前提・実現したいこと モーダルウインドウを自サイトに実装したくて、下記ページを参考にしました。 [ プログラミング ] jQueryでスクロールバーの出るモーダルウィンドウを作る方法 http://coolwebwindow.com/jquery-lab/archives/352 ``` [DEMO]jQueryでスクロールバーの出るモーダルウィンドウを作る方法 リンク1 リンク2 リンク3 リンク4 リンク5 リンク1の内容です。・・・ 閉じる リンク2の内容です。・・・ 閉じる リンク3の内容です。・・・ 閉じる リンク4の内容です。・・・ 閉じる リンク5の内容です。・・・ 閉じる クリックしてみてください。ウィンドウより大きいモーダルウィンドウにはスクロールバーが出ていると思います。 << 記事に戻る ``` コードをほぼコピペしてモーダルウインドウを実装できたのですが、分からないことがあります。 15行目でモーダルウインドウを表示するためのクリックイベントを定義してます。 ``` $('.modal-open').click(function(){ ``` その後、この定義したクリックイベントを閉じる前に、モーダルウインドウを閉じるクリックイベントを定義しています。 ``` //46行目 $('.modal-wrap, .modal-close').off().click(function(){ ``` なぜこれで動くのでしょうか? 私の認識ではこんな感じで開く処理を閉じる処理は別々に記述すると思っていました。 ``` $('.modal-open').click(function(){ //モーダルウインドウを開く処理 }); $('.modal-wrap, .modal-close').off().click(function(){ //モーダルウインドウを閉じる処理 }); ``` 今回参考にしたコードはこうなってますよね? ``` $('.modal-open').click(function(){ //モーダルウインドウを開く処理 //開く処理の途中で閉じる処理 $('.modal-wrap, .modal-close').off().click(function(){ //モーダルウインドウを閉じる処理 }); }); ``` 私のjqueryに対する認識が間違っているということのなのでしょうが、どう理解すればいいのでしょうか。 クリックイベントを入れ子にした場合、どのように処理されますか。 よろしくお願いします。
回答: > > どう理解すればいいのでしょうか。 > > > 「 `$('.modal-open')` をクリックしたときに `$('.modal-wrap, .modal-close')` のイベントを(もし有っても)はずして(`.off()`)イベントを設定している」 と言うことだと思います。