javascript - DOM 准备好后删除元素

Question

我有一些用户可以填写的字段(例如，姓名、号码、地址)，然后他们可以单击“添加”，这会创建一个 div，显示他们刚刚使用“删除”按钮输入的信息(a href) 每个条目。我遇到的问题是，一旦 DOM 准备好，删除按钮就不起作用。我已经硬编码了一个删除按钮，用于删除第三个 div(第三个是任意的)，并且该按钮有效，但不适用于页面加载后生成的按钮。我的问题是，在 DOM 准备好后，如何让删除按钮起作用？

这里是remove函数(id被传入，所以它知道要删除哪个div):

function remove(id) {
    $("div.reviewSub"+id).remove();
}

这是调用该函数的处理程序:

$(".remove").click(function(event) {remove(event.target.id);});

检索数据后显示数据的方式是使用.append():

$(".reviewSub"+num).append("<a href=\"#\" class=\"remove\" id=\"" + num + "\">Remove</a>");

Answer 1

您可以在 jQuery 中使用 live 方法。

$('.remove').live('click', function(event){
    remove(event.target.id); 
});

我怀疑您在附加 DOM 之前有代码 $(".remove").click(function(event) {remove(event.target.id);}); 。因此，jQuery 无法将单击事件绑定(bind)到该元素，因为该元素尚不存在。

更多文档请点击 http://api.jquery.com/live/