2012-09-19 50 views
2

当第一行中的链接被点击时,我需要删除表格的三行。使用jQuery删除多个表格行

这些行是使用jQuery动态创建的,并预先挂载到表中,如下所示。

var ups=''; 
     ups+='<tr data-file='+file_id+'>'; 
     ups+='<td width="40%">'+gl_file_name1+'</td><td>'+gl_upload_date1+'</td>'; 
     ups+='<td>'+gl_upload_desc+'</td>'; 
     ups+='<td><a href="sym.php?doc_id='+file_id+'" class="view2_fl">VIEW FILE</a> | <a href="javascript:void(0);" data-file='+file_id+' data-job='+job_id+' class="del2_fl">DELETE</a></td></tr>'; 
     ups+='<tr><td>'+priority+'</td><td>'+price+'</td><td>'+tender+'</td><td>&nbsp;</td></tr>'; 
     ups+='<tr class="bottom-row"><td colspan="4">'+notes+'</td><tr>'; 

     $(ups).prependTo('.app_table'); 

这是循环多少次'文件'。

当DELETE链接被按下时,我需要删除所有三行。到目前为止,我已成功使用下面的代码删除第一行:

$(this).closest("tr").remove(); 

我曾尝试使用的.next(),但是这似乎并没有工作。

回答

4

获取一行的链接,并从那里你可以得到下一行,并添加到jQuery对象,并删除所有一气呵成三:

var tr = $(this).closest("tr"); 
tr.add(tr.next()).add(tr.next().next()).remove(); 

通过首先获取所有三行,您不会遇到问题,即您想要找到与已删除的行相邻的行。

+1

+1很整齐!演示:http://jsfiddle.net/rupw/tZMgs/1/ – Rup

2

next()应该工作我认为。尝试将参考文件保存到最近的tr并先删除其他参考文献,例如

var $tr = $(this).closest("tr"); 
$tr.next("tr").remove(); 
$tr.next("tr").remove(); 
$tr.remove(); 

演示小提琴:http://jsfiddle.net/rupw/tZMgs/

2

只是另一种想法,你可以使用一个像GT这样的选择器。

例如:

$('tr:gt(1)').remove() 

如果所述第一后删除行。

$('tr:eq(0)').remove() 

应删除第一行

Reggards