使用jquery删除表行 - Table row delete using jquery

Table row delete using jquery

本文关键字：删除 jquery 使用 | 更新日期: 2023-09-27

我编写了这段代码来删除表行：

jQuery('tr#rowAttend1').remove();

HTML:

具有相同id的三行。例如：

<tr  id="rowAttend1" ><td>ssss</td></tr>
<tr  id="rowAttend1" ><td>ddddd</td></tr>
<tr  id="rowAttend1" ><td>ccccc</td></tr>

但是我想把这三个都去掉它在除ie7之外的所有浏览器中都能正常工作？有人能帮我吗？

<tr  id="rowAttend1" ><td>ssss</td></tr>
<tr  id="rowAttend2" ><td>ddddd</td></tr>
<tr  id="rowAttend3" ><td>ccccc</td></tr>
$('#rowAttend1,#rowAttend2,#rowAttend3').remove();

将ID更改为唯一ID，然后可以删除表行

类示例

<tr  class="rowAttend1" ><td>ssss</td></tr>
<tr  class="rowAttend1" ><td>ddddd</td></tr>
<tr  class="rowAttend1" ><td>ccccc</td></tr>
$('.rowAttend1').remove();

这将删除类rowAttend 的所有元素

您的ID不是唯一的，请使用不同的ID，例如

<tr  id="rowAttend1" ><td>ssss</td></tr>
<tr  id="rowAttend2" ><td>ddddd</td></tr>
<tr  id="rowAttend3" ><td>ccccc</td></tr>

（或）

将特定的eventcatch（e）（即）（this）传递给该javascript函数，并从中删除类似的

$(this).remove();

如果你喜欢，可以尝试一些不同的方法

<table>
    <tr><td>one</td> <td><button class="removeTR"> one</button></td> </tr>    
    <tr><td>two</td> <td><button class="removeTR"> two</button></td> </tr>    
    <tr><td>three</td> <td><button class="removeTR">three</button></td> </tr>    
    <tr><td>four</td> <td><button class="removeTR"> four</button></td> </tr>    
   <tr><td>five</td> <td><button class="removeTR"> five</button></td> </tr>    
</table>
$("tr .removeTR").live('click', function() {
    $(this).parent().parent().remove();
});

或者一些东西，提供良好的平滑行删除

$("tr .removeTR").live('click', function() {
    $(this).parent().parent().fadeOut(1000);
    setTimeout(function(){$(this).parent().parent().remove();}, 1000);
});