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

谢谢大家。

我通过将以下代码添加到 XMLHTTP 请求的“成功”事件中解决了这个问题，该请求使用来自服务器的元素填充了 DOM。这对我有用。乔希，你让我的头朝着正确的方向移动（虽然很高兴看到代码插图）所以我将你的回复标记为答案。

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后应用事件处理程序