Javascript JQuery单击事件以添加或删除表行

我有一个表格，上面有加号或减号字形图标，允许用户添加或减去行。我的代码可以工作，但是如果用户点击减号按钮太多次，它会吃掉整张桌子

我尝试的是在我添加的行中添加一个唯一的ID标记，并且只删除带有ID的TRs，但是如果添加两行并按下减号，两行将同时删除，我只希望一次删除一行。注意：下面的代码不反映此尝试

字形图标：

<div class="well" style="margin-bottom:0px;" id="addrow">
  <span class="glyphicon glyphicon-plus" id="add"></span>
  &nbsp;&nbsp;&nbsp;&nbsp;
  <span class="glyphicon glyphicon-minus" id="minus"></span>

表:

<table class="table table-bordered table-striped" style="margin-bottom:0px;" id="myTable">
    <tr>
      <td>Customer Master #</td>
    </tr>
    <tr>
      <td><input type="text" class="form-control" ></td>
    </tr>
  </table>

客户主#

JS:

$（文档）.ready（函数（）{
$（“#添加行”）。在（“单击”，“添加”，函数（）上）{
变量tablerow=''
$（“#myTable tr:last”）。在（tablerow）之后；
})
$（“#添加行”）。在（“单击”、“span#减号”函数（）上{
$（'#myTable tr:last'）.remove（）；
} )
});

不确定您是否100%希望更改代码，但这里有一个可以添加或删除的小提琴，但不会删除第一行（不会吃掉整张桌子）

将给出有多少数据（输入）行。在这个提琴中，我检查是否有多于一个的数据行，如果没有，则不会进行删除

---

注意：我将您的图示符转换为“+”和“-”文本，以便在此处看到它们。

查看将

onclick

事件更改为

mouseup

是否有效。不久前我也遇到了类似的问题。

我添加了一个if语句，仅当表有3行或更多行时才允许取出一行。这将保留我始终希望位于页面上的最后两行

if ($('#myTable tr').length > 2)

这似乎解决了问题

完整代码：

 $("#addrow").on("click", "span#minus", function(){
      if ($('#myTable tr').length > 2) {
      $('#myTable tr:last').remove();
    };
    } )

---

使用类而不是ID，ID应该是唯一的你是正确的，但无论我使用哪个，都会出现相同的结果。我无法重现你的错误…请用有问题的代码更新小提琴可能会有所帮助。这是朝着正确方向迈出的一步。在我的代码中有更多的列。我为这个问题简化了它。我不希望基于.form控件进行选择。@SteveW。你能适应你的真实代码吗？其思想是用一个类唯一地标识您的输入行，然后使用该类的.count（）确保删除操作只在至少有两个输入行时有效。

if ($('#myTable tr').length > 2)

 $("#addrow").on("click", "span#minus", function(){
      if ($('#myTable tr').length > 2) {
      $('#myTable tr:last').remove();
    };
    } )