javascript - 动态创建的DOM对象被触发多次

该程序具有两个javascript函数，用于生成一个表（generateTable）和删除一个选定的行（deleteOneRow）。

generateTable函数根据服务器数据生成一个表。每行的格式如下：

<tr><td><span class="desc">aaa</span><a href="#delete_choice" class="delete-choice">Delete</a></td> </tr>

基本上，每一行都是一些文本，后跟“删除”链接。
脚本完成表生成后，将调用$(".delete-choice").click(deleteOneRow)将click绑定到事件处理程序。

在事件处理函数deleteOneRow中，它首先简单地删除表中的所有行。然后再次调用generateTable以显示剩余的数据条目。代码结构如下：

function deleteOneRow() {
    var choiceIdx = ... //get index
    $(".delete-choice").unbind('click');
    CurrentChoices.splice(choiceIdx, 1); // remove the entry from the array
    $("#problem-choice-table  tr").each(function(){ // delete the DOM entries
        $(this).remove();
    })
    generateTable();
}

如果表有两行，请单击第一行中的删除链接，然后删除第一行。然后，它生成一个表，其中第二行移至第一行。但是，再次调用deleteOneRow，然后第二行最终被删除。

我猜这是由于事件被多次触发所致。我尝试了解除绑定，stopPropagation等操作，但没有任何效果。

最佳答案

使用jquery的live附加事件非常适合这种情况，在这种情况下，内容是动态添加/删除的，并且您想与同一个选择器匹配，您是否打算使用它？

关于javascript - 动态创建的DOM对象被触发多次，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8060156/