jQueryは、ajaxによってロードされた、またはhtml（）メソッドによって挿入されたdiv要素を呼び出します。

Question

これは私の最初の投稿です。私はここでシンプルな質問を検索し、いくつかの答えを見つけましたが、実際に私を助けるこの特定の問題の解決策を見つけることができませんでした。

私は主な内容をajaxで読み込むウェブページを持っています。単純に次のようになります。

function loadContent(content) { 

if(localStorage.content != content) { 
    $("#content #content_loading").css("display", "block"); 
} 

var userID = Cookies.get("UserID"); 

$.ajax({      
    url: '../game/data/load_content.php',  
    type: 'post', 
    data : { ID : userID, Content : content },     
    success: function(response) { 
     $("#content #content_loading").css("display", "none"); 
     $("#content #import").html(response); 
     localStorage.content = content; 
     $("#header").html("<div class='header_text'>"+content+"</div>"); 
     } 
}); } 

他のajax関数、html、cssが読み込まれます。私は数千から数千のコード行を持っているので、単純なことは扱いにくくなります。今は、ポップアップウィンドウ用の普遍的な「閉じる」ボタンを作成したいだけです。すべてのポップアップウィンドウはボックス内にあり、閉じるボタンはボックスヘッダー内にあります。今私は、単一の機能で、すべてのポップアップウィンドウを閉じたい：

$('.close').click(function() { 
    $(this).parent().parent().fadeOut(); 
}); 

これは単にヘッダ、その後、全体ボックスでその親の親である近い要素の親を選択します。ポップアップ機能の一つは、次のようになります。

function showPopup(header, content) { 
    $("#popup_header").html(header+"<div class='close'></div>"); 
    $("#popup_content").html(content); 
    $("#popup").fadeIn(300); 
} 

この関数は、メイン文書（<script src="script"></script>）に含まれています。

他のポップアップはloadContent（content）関数に直接ロードされるため、ajax呼び出しがロードされます。私はアヤックスはそれが動作するロードされていることを文書でクリックすると「クローズ」関数を挿入すると今

<div id="nearby_players"> 
    <div class="header">PLAYERS NEARBY <div class="close"></div></div> 
     <ul> </ul> 
</div> 

：そしてそれは、単純に次のようになりますHTMLです。 loadPopup（）関数を次のように変更した場合：

これも機能します。しかし、私がしたいのは、メイン文書に添付された単一のクリック機能を作成して、ウェブページにロードされているか、すでにウェブページ上にあるすべてのポップアップを閉じることです。 「close」要素はクラスではないIDなので、それは問題だと思った。それはユニークでなければならないので、クラスに変更しました。だから私の質問です。クラス 'close'を持つすべての要素をajaxでロードしているかどうかをどのように参照するのですか？そして、そのajax内で別のajaxなどで再度ロードされます。また、Webページが読み込まれたときに既にドキュメントに挿入されているポップアップも表示されます。

これらの要素をDOMに追加してjQueryが実際に見つけられるようにするにはどうすればよいですか？

よろしく、 Hazes！

Answer 1

要素を動的に作成します。つまり、イベントはイベントに関連付けられません。 動的に作成された要素にイベントを添付する方法をお読みください。http://api.jquery.com/live/