Question

$('#action_button').click(function(){
    var tbody = $('#table_body').prepend(''+
        '<tr class="fresh">'+
            '<td>John Doe</td>'+
            '<td>235-75-75</td>'+
            '<td>some text</td>'+
            '<td>@#!@#!%!#%</td>'+
        '</tr>');

    setTimeout(function(){
        tbody.children('tr:first-child').removeClass('fresh');
    }, 1000);
});

我要在表格中添加几行“fresh”类。然后我想在一段时间后删除每个新行的类。但它不按我计划的方式工作。如果添加多行，则仅在最后添加的行中删除该类。如何解决？

jsfiddle

非常感谢：）

Answer 1

创建元素，然后将其添加到表中，保留对元素的引用，以便稍后在删除类时使用。这仍然允许您一次删除第一类元素，但是如果在删除前一个元素之前添加其他元素也无关紧要。在http://jsfiddle.net/HmH3n/3/

更新了小提琴

$('#action_button').click(function(){
    var $tr = $('<tr class="fresh">'+
            '<td>John Doe</td>'+
            '<td>235-75-75</td>'+
            '<td>some text</td>'+
            '<td>@#!@#!%!#%</td>'+
        '</tr>');

    $('#table_body').prepend($tr);

    setTimeout(function(){
        $tr.removeClass('fresh');
    }, 1000);
});

Answer 2

您正在尝试操纵不是对象的变量。

var tbody与var $tbody

完全不同

此处解释：What is the difference between "$variable" and "variable" - JavaScript - jQuery

此外，您不应该在prepend同时将其作为变量保存到table_body时启动click。最佳做法是单独进行。此外，并非所有内容都必须放在var $tbody = $('#table_body'); $('#action_button').click(function () { var $tr = $('<tr class="fresh">' + '<td>John Doe</td>' + '<td>235-75-75</td>' + '<td>some text</td>' + '<td>@#!@#!%!#%</td>' + '</tr>'); $tbody.prepend($tr); setTimeout(function () { $tr.removeClass('fresh'); }, 1000); });事件中。将两个对象保存在它之外，这样就不会一次又一次地创建它们。

table_body

正如您在上面所看到的，我们将ID $tbody的div保存为tr的对象，以便我们可以一遍又一遍地使用它，而无需强制DOM搜索它因为它将它保存在内存中。我们还使用新的{{1}}元素进行保存以实现可重用性。

<强> WORKING EXAMPLE HERE

Answer 3

您可以在行上添加临时类，然后将其删除。

$('#action_button').click(function(){
    var tbody = $('#table_body').prepend(''+
    '<tr class="fresh tmpClass">'+
        '<td>John Doe</td>'+
        '<td>235-75-75</td>'+
        '<td>some text</td>'+
        '<td>@#!@#!%!#%</td>'+
    '</tr>');


setTimeout(function(){
     $('#table_body').find('.tmpClass').removeClass('fresh').removeClass('tmpClass');
 }, 1000);

如何从表中的每个新行中删除类？

3 个答案: