質問: クリックイベントでモーダルと、その後ろに1枚レイヤーを生成させ、 closeボタン、もしくは生成したレイヤーをクリックした際にモーダルが消えるようにしたいのですが、 closeボタンクリックではうまくいくのですが、レイヤーをクリックしても処理が実行されません。 エラーメッセージもないので、どこから手をつけて良いのか。。。 アドバイスなどよろしくお願いします。 ``` × modal open ``` ``` $("#open").on("click",function(){ $("body").append(""); $("#moda,#overlay").fadeIn(); return false; }); $("#close,#overlay").on("click",function(){ $("#modal,#overlay").fadeOut("slow", function(){ $('#overlay').remove() ; }); }); ```
回答: > > どこから手をつけて良いのか。。。 > > > 回答には直接関係ありませんが、とりあえずインデントを付けるところからはじめましょう。 問題はclickするまで#overlayの要素がHTML上に無いためです。 ``` $("#open").on("click", function() { $("body").append(""); $("#moda,#overlay").fadeIn(); return false; }); $("body").on("click", "#close,#overlay", function() { $("#modal,#overlay").fadeOut("slow", function() { $('#overlay').remove(); }); }); ```