Javascript 使用jQuery删除HTML表行

我有一个HTML表，其中的行可以通过单击按钮动态添加（也可以通过jQuery完成）。我现在想要的是，我需要在每行的旁边有一个按钮。按它将删除该特定行

该表如下

<tr class="item-row">
         <td class="item-name">
          <div class="delete-wpr"><textarea></textarea><a class="delete" href="javascript:;" title="Remove row">X</a></div></td>

           <td><input type="text" class="slno"/></td>           

          <td><input type="text" class="cost"/></td>
          <td><input type="text" class="qty"/></td>
          <td><span class="price"></span></td>
      </tr>  

添加更多行的Jquery如下所示

 $("#addrow").click(function(){
$(".item-row:last").after('<tr class="item-row"><td class="item-name"><div class="delete-wpr"><input type="text" class="slno"/><a class="delete" href="javascript:;" title="Remove row">X</a></div></td><td><input type="text" class="slno"/></td><td><input type="text" class="cost"/></td><td><input type="text" class="qty"/></td><td><span class="price"></span></td></tr> ');

$（“#添加行”）。单击（函数（）{
$（“.item row:last”）。在（“”）之后；

我正在使用的功能是这个。但它不起作用

$(".delete").on('click',function(){
$(this).parents('.item-row').remove();
update_total();
if ($(".delete").length < 2) $(".delete").hide();
  });

$（.delete”）。在（'click'，function（）上{
$（this）.parents（'.item行'）.remove（）；
更新_total（）；
如果（$（“.delete”）.length<2）$（.delete”）.hide（）；
});

---

那么我该怎么做呢？

由于行是动态的，您需要一个委托事件处理程序，附加到元素的非更改祖先。

文档是最好的默认值，如果没有更接近/更方便的：

$(document).on('click', ".delete", function(){
    $(this).closest('.item-row').remove();
    update_total();
    if ($(".delete").length < 2) $(".delete").hide();
});

委派事件通过在事件发生时而不是在事件注册时应用jQuery选择器来工作。这意味着它们可以在以后存在。
由于行是动态的，您需要一个委派事件处理程序，附加到元素的非更改祖先。
如果没有更接近/更方便的内容，则文档是最佳默认值：

$(document).on('click', ".delete", function(){
    $(this).closest('.item-row').remove();
    update_total();
    if ($(".delete").length < 2) $(".delete").hide();
});

委派事件通过在事件发生时而不是注册事件时应用jQuery选择器来工作。这意味着它们可以在以后存在。
首先，将表标签放在add上，然后尝试以下操作：

            $('table').on('click', ".delete", function() {
              $(this).closest('tr').remove(); // more simple
            });

首先，将表格标签放在add上，然后尝试以下操作：

            $('table').on('click', ".delete", function() {
              $(this).closest('tr').remove(); // more simple
            });


$（文档）.ready（函数（）{
$（'#btadd'）。单击（函数（）{
深交所=''；
$（'tbl#u test tbody'）。追加（szTr）
});
$（'table'）。在（'click'，.delete'，函数（）{
$（this）.closest（'tr.item-row'）.remove（）；
});
});
添加行

$（文档）.ready（函数（）{
$（'#btadd'）。单击（函数（）{
深交所=''；
$（'tbl#u test tbody'）。追加（szTr）
});
$（'table'）。在（'click'，.delete'，函数（）{
$（this）.closest（'tr.item-row'）.remove（）；
});
});
添加行
表格ID为“items”。这是必需的吗？表格ID为“items”。这是必需的吗？Better-downvote已删除。使用委派事件处理程序，您应该以单个特定元素为目标，或者将
文档
作为默认值。例如，如果页面中有多个表，则您的示例将在只需要一个委派处理程序时附加多个委派处理程序。Better-downvote已删除。使用dele门控事件处理程序，您应该将单个特定元素作为目标，或者将
文档
作为默认值。例如，如果一个页面中有多个表，则您的示例将在只需要一个代理处理程序时附加多个代理处理程序。您可能需要改写“将表标签放在add上”因为我不明白你的意思。此外，委派事件应该以单个特定元素为目标，或者默认为
文档
。否则，你可能会得到多个委派处理程序，这是浪费/毫无意义的。：）你可能需要改写“将表标签放在add上”因为我不明白你的意思。此外，委派事件应该以单个特定元素为目标，或者默认为
文档
。否则你可能会得到多个委派处理程序，这是浪费/毫无意义的。：）