Splice JSON数组JavaScript

我创建了一个函数来重用javascript数组的拼接function，但是，在我运行一次后，它无法重用。

var removePerson = function(d, person_id) { var person_index = d.findIndex(i => i.id == person_id); d.splice(person_index, 1); return d; }; 

我没有收到控制台错误。 我不知道如何调试它。 这是我的JSFiddle 。

如果您运行该示例，您将看到可以从列表中删除任何1个人，但是当您尝试删除剩余的2个中的任何一个时，没有任何反应（例如，控制台错误，控制台响应）。 知道如何支持我的removePerson()函数重用吗？

Answer 1

由于populateList工作方式，您的解决方案无效。

在你的populateList ，你有一行：

 $('#load').empty(); 

此行清空表并删除随click事件侦听器附加的按钮。

然后，添加全新的button.delete ，它不附加任何事件侦听器。

要解决此问题，您可以将.on()放入populateList函数中。

 var populateList = function(d) { $("#load").empty(); var new_rows; for(var i = 0; i < d.length; i++) { new_rows += "" + "" + d[i].id + "" + "" + d[i].name + "" + "" + d[i].phone + "" + "delete" + ""; } $("#load").append(new_rows); // delete event $(".delete").on("click", function() { var delete_sel = $(this).attr("data-id"); populateList(removePerson(d, delete_sel)); }); }; 

这是一个有效的jsFiddle 。

或者，您可以使用此答案的解决方案（这是一个更清洁的解决方案）。

 $("table").on("click",".delete", function() { var delete_sel = $(this).attr("data-id"); populateList(removePerson(data, delete_sel)); }); 

更多解释为什么他的答案适用于jQuery文档 （查看selector参数）。

Answer 2

试试这个代码： JSFiddle

  $("table").on("click",".delete", function() { var delete_sel = $(this).attr("data-id"); populateList(removePerson(data, delete_sel)); });