动态删除拼接的tr标签

最新推荐文章于 2023-08-02 15:40:58 发布

岁月栖迟

最新推荐文章于 2023-08-02 15:40:58 发布

阅读量269

点赞数

文章标签： js

本文链接：https://blog.csdn.net/weixin_40341786/article/details/109067886

版权

本文介绍了在网页动态生成表格时，如何使用jQuery实现删除特定行的方法，包括通过遍历并动态拼接HTML代码，以及利用已选中checkbox的值来定位并移除对应的`<tr>`元素。两种方法适用于不同场景，帮助开发者高效管理表格数据。

摘要由CSDN通过智能技术生成

删除tr有两种方法

动态拼接tr的部分代码

$.each(data,function (i,n) {
					    str+="<tr id=\"tr_"+n.id+"\">";
						str+="<td><input type=\"checkbox\" value=\""+n.id+"\"/></td>";
						str+="<td>"+n.name+"</td>";
						str+="<td>"+n.startDate+"</td>";
						str+="<td>"+n.endDate+"</td>";
						str+="<td>"+n.owner+"</td>";
						str+="</tr>";
					})
					$("#tbody").html(str);

方法一

var checkboxs=$("#tbody input[type='checkbox']:checked");
 $.each(checkboxs,function () {
                         $(this).parent().parent().remove();
                         
                       })

方法二

在添加tr时，设置唯一的id

var checkboxs=$("#tbody input[type='checkbox']:checked");
 $.each(checkboxs,function () {
                           $("#tr_"+this.value).remove();
                       })