javascript - サーバーから来る要素に EventListener を追加するにはどうすればよいですか?

Question

問題のタグがサーバーから (xmphttp 要求を介して) 生成されているときに、addEventListener (window.onload) を使用してクリック イベントを追加するにはどうすればよいですか?

ありがとう！

Answer 1

DOMがロードされた状態で使用できる親要素のイベントを処理してから、イベントに関連する要素を取得することができます。

<ul id="list">
  <li id="first">The first</li>
  <li id="second">The second</li>
  <li id="third">The third</li>
</ul>

document.getElementById('list').onclick(function(e){
  o = e.originalTarget;
  // if you click on second li o will bi the same as document.getElementById('first')
  // even if li with id "first" is inserted to DOM after creating this event handler to "list"
  // so here you can perform actions with it
  // hope it will help
});

Answer 2

皆さんありがとう。

サーバーからの要素をDOMに入力するXMLHTTPリクエストの「成功時」イベントに以下のコードを追加することで、これを解決しました。それは私のために働いた。ジョシュ、あなたは私の頭を正しい方向に動かしたので（コードの図を見るのは良かったのですが）、あなたの応答を答えとしてマークしました.

if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200)) {

                        var m_sel=document.getElementById("fcat");

                        if (m_sel) {

                            var maxi = m_sel.options.length;

                            for( var i = 0; i < maxi; i++ )
                            {
                                var option = m_sel.options[i];
                                    option.addEventListener( "click", toggleElem, true );

                            }                                 

                        }        
}

Answer 3

要素が DOM に挿入された後、イベント ハンドラを適用する必要があります。