Question

我想添加＆＃39;点击＆＃39;侦听器动态创建元素。我的代码是：

<option>

但它不起作用（控制台中没有错误）

Answer 1

正如您所说的动态添加元素，事件委派将是更好的方法。下面既适用于静态元素，也适用于动态添加的元素：

＆＃13;

document.getElementById("container").addEventListener("click", function(e) {
  if (e.target && e.target.matches("div.className")) {
    console.log('element clicked', e.target.innerText);
    // or call your function
  }
});
var index = 0;
document.getElementById('add').addEventListener('click', function(e) {
  var div = document.createElement('div');
  div.appendChild(document.createTextNode(index++));
  div.className = 'className';
  document.getElementById('container').appendChild(div);
});

＆＃13;

<div id="container">
  <div class="className">a</div>
  <div class="className">b</div>
  <div class="className">c</div>
  <div class="className">d</div>
  <div class="className">e</div>
</div>
<button id="add">Add Element</button>

＆＃13;

Answer 2

好的，你错过了一些东西，事件不会注册，直到你调用函数

addListenerToElements();

https://jsfiddle.net/xrqnn20f/1/

addListenerToElements();
function addListenerToElements (){
        var aTags = document.getElementsByClassName("classElements")
        for (var i=0;i<aTags.length;i++){
            aTags[i].addEventListener('click',myFunction);
        }
    }

    function myFunction() {
        console.log("something");
    }

Javascript按类名添加对象的侦听器

2 个答案: