javascript - 动态 HTML 的事件监听器不起作用

Question

使用 angularjs 指令，我将事件监听器添加到动态创建的插入 DOM 的 HTML 元素。

但是，事件监听器并未触发。如果我向文档添加一个事件监听器，它可以工作，但它似乎没有调用与动态添加的元素关联的事件监听器。

我已经为这个问题创建了一个 fiddle :Fiddle .

我将动态元素创建为:

button = document.createElement('button');

然后我添加事件监听器:

button.addEventListener('click', function () {
    alert("Button event listener is called");
});

但是事件监听器永远不会被调用。

编辑:请注意该指令将在多个位置使用，我正在寻找一种不使用类或 ID 但仍必须唯一捕获点击的解决方案。

Answer 1

代替:

element[0].insertAdjacentHTML('afterend', button.outerHTML);

使用:

element[0].insertAdjacentElement('afterend', button);

演示:http://jsfiddle.net/7nus5/