使用jQuery删除表格行 [英] Remove table row using jQuery

问题描述

以下是我的代码

$(document).ready(function(){
    $('#click').click(function(){
        $('#table').append('<tr><td>&nbsp;</td></tr>');
    })
    $('#remove').click(function(){
        $('#table').remove('<tr><td>&nbsp;</td></tr>');
    })
})

HTML

<table width="100%" border="1" cellspacing="0" cellpadding="0" id="table">
    <tr>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
    </tr>
</table>
<div id="click">click</div>
<div id="remove">remove</div>

当我添加一行时，效果很好，但是我不知道如何删除表的最后一行.您还可以查看在线演示.

When I add a row it works great, but I don't know how to delete the last row of the table. You can also check the online demo.

我该怎么做?

此外，我希望当用户也单击任何行时，它都会删除自己.我已经尝试过了，但是有问题.如果单击该行，它将删除自身，但是当您通过单击#click添加一行时，则该行不会通过单击来删除自身.

In addition, I want when the user also clicks on any row it will delete itself. I have tried out, but there is a problem. If you click on the row it is deleting itself, but when you add a row by clicking in #click then the row is not deleting itself by clicking on it.

这是我的代码:

$(document).ready(function(){
    $('#click').click(function(){
        $('#table').append('<tr><td>&nbsp;</td></tr>');
    })
    $('#remove').click(function(){
        $('#table tr:last').remove();
    })
    $('#table tr').click(function(){
        $(this).remove();
    });
})

推荐答案

如果要删除#table的最后一个表行，则需要使用选择器将其定位，然后针对它调用$.remove():

If you want to remove the last table row of #table, you need to target it with your selector, and then call $.remove() against it:

$('#remove').on("click", function(){
    $('#table tr:last').remove();
})

这篇关于使用jQuery删除表格行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！