2

我有桌子

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="activity_tab">
    <tr id="list_1">
        <td><span class="new_act">Folder files Created</span>
        </td>
        <td>2013-06-24 02:11 am</td>
    </tr>
    <tr id="list_2">
        <td><span class="new_act">Folder ss Created</span>
        </td>`enter code here`
        <td>2013-06-24 02:11 am</td>
    </tr>

当我单击要向该行添加所选类的行时，它的动态表数据会在运行时出现。之后我在页面顶部有超链接 

 <li><a href="javascript:void(0);" class="delete">Delete</a></li>

这是我现在的超链接，当单击超链接时，选定的行将被删除我怎样才能获得选定的行，我对它的删除有所有想法，但找不到任何解决方案......

4

4 回答 4

3

你可以这样做 -

$('.activity_tab tr').on('click',function(){
  $(this).addClass('selected');
});
$('.delete').on('click',function(){
   $('tr.selected').remove();
});
于 2013-06-24T11:43:19.297 回答
2

我会在选定的行上添加一个类。我假设您一次只能选择一个行，因此在单击新行时需要删除任何选择。

由于您的表是动态的，因此您需要使用委托事件侦听器来添加选定的类。有关委托事件的更多详细信息，请参阅jQuery 的 on() 方法的文档。

$(document).on('click', 'tr', function(e) {
    $('tr.selected').removeClass('selected'); //clear other selections
    $(this).addClass('selected'); //mark this row as selected
});

$('a.delete').on('click', function(e){
   e.preventDefault(); //stop native link behavior
   $('tr.selected').remove(); //remove selected row
});

请注意，将selected类添加到行的侦听器将影响文档中的任何tr元素。如果您的页面上有其他表格，则需要使第二个选择器（在“单击”之后）更具体。

于 2013-06-24T11:44:07.563 回答
1

你可以试试这个

$(function(){
    $(".activity_tab tr").click(function(){
        $(this).addClass("red");
    });

    $('.delete').on('click',function(){
       $('tr.red').remove();
    });
});

演示：http: //jsfiddle.net/YNNVr/

于 2013-06-24T11:49:16.310 回答
0

您可以使用以下代码在单击时添加selected类。tr

$('.activity_tab').on('click', 'tr', function(){
   $(this).addClass('selected');
});

如果您想更进一步，您可以使用toggleClass代替addClass，这样您只需再次单击 即可删除selected该类tr。

然后，您可以选择所有selected行并删除它们

$('.delete').on('click', function(){
   $('activity_tab .selected').remove();
});

这将删除具有selected类的表中具有activity_tab类的所有行。

于 2013-06-24T11:50:05.907 回答