事件不适用于通过Ajax放置的元素

Question

我有一些带有事件＆＃34; onclick＆＃34;的元素，但我需要用ajax更新这些元素，不幸的是onclick事件已被绑定。

我的问题是，如何刷新事件触发器？有办法吗？

Answer 1

由于事件只能绑定到当时存在的元素，因此您可以使用名为＆＃34;事件委派的小技巧＆＃34;。

这意味着您将收听已存在的父元素的点击，如果点击是在符合您要求的子元素上，请执行某些操作。例如，您新添加的元素可以附加到容器中：

<ul id="output"></ul>

由于你没有提到使用jQuery，我创建了一个没有它的版本，还有一个版本。例如：

---

原生JS

document.getElementById('output').addEventListener('click', makeMeRed);

然后，在makeMeRed示例函数中，您需要检查您单击的元素（event.target）是否符合您的要求（在这种情况下我想要<li>）：< / p>

function makeMeRed(event){
    if(event.target && event.target.nodeName == 'LI'){
        event.target.style.background = 'red';
    }
}

JS Fiddle Demo

---

使用jQuery

事件委托可以这么简单：

$('#output').on('click', 'li', makeMeRed);

function makeMeRed() {
    $(this).css('background', 'red');
}

JS Fiddle Demo

Answer 2

您可以使用此方法触发点击事件。

$( "class or id " ).trigger(click);