javascript - 在 empty().append() 元素之后单击事件松散目标

Question

我有一个函数addItems可以动态地将项目添加到元素，因此每次调用该函数时<div id="totalPremium"></div>它都会清空并添加项目div

function addItems(){
   /....../
   $("#totalPremium").empty();
   $("#totalPremium").append("<div>item</div>");
}

点击事件函数下方拾取一个添加的项目

$("#totalPremium > div").bind('click', function () {
    //do stuffs
}

问题是第一次添加项目时，我可以通过单击功能将其拾起，但是在将新项目替换为前一个项目后，单击甚至似乎失去了目标并且无法执行。我正在寻找建议以使其发挥作用。

score 2 · Accepted Answer

您需要对动态添加的项目使用事件委托

$("#totalPremium").on('click','div', function () {
    //do stuffs
});

score 0 · Accepted Answer

点击处理程序只会应用于调用它之后存在的元素。如果您删除元素并添加新元素，它们不会自动拥有点击处理程序。每次创建新元素时都必须添加处理程序

2 回答 2