使用jQuery删除表行

前端之家收集整理的这篇文章主要介绍了使用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>

当我添加一行它很好,但我不知道如何删除表的最后一行.您也可以在线查看demo.

我该怎么做?

另外,我想要当用户也点击任何行时,它将自动删除.我试过了,但是有一个问题.如果您单击它自己删除的行,但是当您通过单击#click添加行时,该行不会通过单击它删除自己.

这是我的代码

脚本

$(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():
$('#remove').on("click",function(){
    $('#table tr:last').remove();
})

猜你在找的jQuery相关文章