Javascript 如何使用每个按钮的事件克隆块（行、按钮）？

我有一张桌子。我想动态克隆块（在tbody中有几行带有按钮（+、-），这些按钮必须添加/删除一行，但添加不正确。我需要每个按钮在块中添加一行，而不是在另一行中添加。请帮助我

$（'.wrapper'）。在（'click'，'.deleteBlock'，function（）上{
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone2'）。不是（':first'）。last（）。remove（）；
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone3'）。不是（':first'）。last（）。remove（）；
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone4'）。不是（':first'）。last（）。remove（）；
});
$（'.wrapper'）。在（'单击'，'.addBlock'，函数（）上{
$（'.addBlock'）。最近（'.wrapper'）。查找（'.rowToClone2'）。第一个（）.clone（）.find（“textarea”）.val（“”.end（）.appendTo（'.bodyToModify'）；
$（'.addBlock'）.closest（'.wrapper'）.find（'.rowToClone3'）.first（）.clone（）.find（）.end（）.appendTo（'.bodyToModify'）；
$（'.addBlock'）。最近（'.wrapper'）。查找（'.rowToClone4'）。第一个（）.clone（）.find（“textarea”）.val（“”.end（）.appendTo（'.bodyToModify'）；
});
$（'.bodyToModify'）。在（'单击'，'.deleteRow'，函数（）上{
$（'.deleteRow'）。最近（'.bodyToModify'）。查找（'.rowToClone2'）。不是（':first'）。last（）。remove（）；
});
$（'.bodyToModify'）。在（'单击'，'.addRow'，函数（）上{
$（'.addRow'）.Close（'.bodyToModify'）.find（'.rowToClone2'）.first（）.clone（）.find（“textarea”）.val（“”.end（）.insertBefore（'.rowToClone3'）；
})；

结果

使用

$（this）

从单击的按钮获取上下文，然后进行搜索和添加/删除

检查代码段

$（'.wrapper'）。在（'click'，'.deleteBlock'，function（）上{
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone2'）。不是（':first'）。last（）。remove（）；
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone3'）。不是（':first'）。last（）。remove（）；
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone4'）。不是（':first'）。last（）。remove（）；
});
$（'.wrapper'）。在（'单击'，'.addBlock'，函数（）上{
$（'.addBlock'）。最近（'.wrapper'）。查找（'.rowToClone2'）。第一个（）.clone（）.find（“textarea”）.val（“”.end（）.appendTo（'.bodyToModify'）；
$（'.addBlock'）.closest（'.wrapper'）.find（'.rowToClone3'）.first（）.clone（）.find（）.end（）.appendTo（'.bodyToModify'）；
$（'.addBlock'）。最近（'.wrapper'）。查找（'.rowToClone4'）。第一个（）.clone（）.find（“textarea”）.val（“”.end（）.appendTo（'.bodyToModify'）；
});
$（'.bodyToModify'）。在（'单击'，'.deleteRow'，函数（）上{
$（this）.closest（'.rowToClone3'）.prev（）.remove（）；
});
$（'.bodyToModify'）。在（'单击'，'.addRow'，函数（）上{
var buttonBlock=$（this）.closest（'.rowToClone3'）；
$（this）.closest（'.rowToClone3'）.prev（）.first（）.clone（）.find（“textarea”）.val（“”.end（）.insertBefore（buttonBlock）；
})；

结果

使用

$（this）

从单击的按钮获取上下文，然后进行搜索和添加/删除

检查代码段

$（'.wrapper'）。在（'click'，'.deleteBlock'，function（）上{
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone2'）。不是（':first'）。last（）。remove（）；
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone3'）。不是（':first'）。last（）。remove（）；
$（'.deleteBlock'）。最近（'.wrapper'）。查找（'.rowToClone4'）。不是（':first'）。last（）。remove（）；
});
$（'.wrapper'）。在（'单击'，'.addBlock'，函数（）上{
$（'.addBlock'）。最近（'.wrapper'）。查找（'.rowToClone2'）。第一个（）.clone（）.find（“textarea”）.val（“”.end（）.appendTo（'.bodyToModify'）；
$（'.addBlock'）.closest（'.wrapper'）.find（'.rowToClone3'）.first（）.clone（）.find（）.end（）.appendTo（'.bodyToModify'）；
$（'.addBlock'）。最近（'.wrapper'）。查找（'.rowToClone4'）。第一个（）.clone（）.find（“textarea”）.val（“”.end（）.appendTo（'.bodyToModify'）；
});
$（'.bodyToModify'）。在（'单击'，'.deleteRow'，函数（）上{
$（this）.closest（'.rowToClone3'）.prev（）.remove（）；
});
$（'.bodyToModify'）。在（'单击'，'.addRow'，函数（）上{
var buttonBlock=$（this）.closest（'.rowToClone3'）；
$（this）.closest（'.rowToClone3'）.prev（）.first（）.clone（）.find（“textarea”）.val（“”.end（）.insertBefore（buttonBlock）；
})；

结果

每个按钮（+、-）必须在其自身之前添加一行“添加不正确”是什么意思？@mplungjan每个按钮（+）添加一行，但它不在其块中添加，而是添加到其他块中。我需要每个按钮在其唯一块中添加和删除一行。因此，单击+按钮后，是否要将子行添加到该块？@mplungjan是的，按钮（+，-）前面的行。但每个按钮必须在其唯一块中添加一行。如何操作？每个按钮（+，-）必须在其自身之前添加一行“添加不正确”是什么意思？@mplungjan每个按钮（+）添加一行，但它不在其块中添加，而是添加到其他块中。我需要每个按钮在其唯一块中添加和删除一行。因此，单击+按钮后，您想将子行添加到该块中吗？@mplungjan是的，按钮（+，-）前面的行.但每个按钮必须在其唯一的块中添加一行。如何操作？