0

我有一张有 5 行的桌子。它应该具有动态添加和删除行的功能。每行有 3 列,partNOquantityabutton用于删除该特定行。每一行都有一个id以及td行内。

我的问题是如果第二行被删除,id连续行的 s 应该减 1 到表的末尾。

<tr id='1'>
    <td><input type="button" id="b1" width="10" value="D"/></td>    
    <td align="center" id='l1'><input type="text" id="t1"></td>
    <td align="center" id='r1'><input type="text" id="q1"></td>
</tr>
<tr id='2'>
    <td><input type="button" id="b2" width="10" value="D"/></td>    
    <td align="center" id='l2'><input type="text" id="t2"></td>
    <td align="center" id='r2'><input type="text" id="q2"></td>
</tr>
<tr id='3'>
    <td><input type="button" id="b3" width="10" value="D"/></td>    
    <td align="center" id='l3'><input type="text" id="t3"></td>
    <td align="center" id='r3'><input type="text" id="q3"></td>
</tr>
<tr id='4'>
    <td><input type="button" id="b4" width="10" value="D"/></td>    
    <td align="center" id='l4'> <input type="text" id="t4"></td>
    <td align="center" id='r4'><input type="text" id="q4"></td>
</tr>
<tr id='5'>
    <td><input type="button" id="b5" width="10" value="D"/></td>    
    <td align="center" id='l5'><input type="text" id="t5"></td>
    <td align="center" id='r5'><input type="text" id="q5"></td>
</tr>

So onclickofb2 tr id=2应该被完全删除,并且下一行 ID 应该相应地递减。tr td应更改按钮的 ID 。对此有什么帮助吗?

4

1 回答 1

0

这有点烦人,特别是如果您有绑定到特定元素的事件。像这样的东西是你想要的:

$("button").on('click', function () {
   var $toRemove = $(this).closest('tr');
   var id = $toRemove.attr('id');
   $toRemove.removeAttr('id');

   $toRemove.nextAll().each(function () {
      this.id = id++;
      //also update td IDs
   });
});
于 2012-12-03T13:32:43.933 回答