Question

我还在用jQuery弄湿我的脚。

我有一个表，我每隔几秒就通过Ajax刷新一次。我正在使用这一段特殊代码使其在刷新表内容后仅突出显示新行（并淡化它们）：

$("#log_table tr.new_row").each(function (){
   var oldBGcolor = $(this).css("background-color");
   $(this).animate({backgroundColor: "#FFFF33"}, "fast").delay(3000).animate({backgroundColor: oldBGcolor}, 3000).removeClass("new_row");
});

我想把这个.each变成一个单独的函数，这样我就可以把它放在另一个表上。而且我预计也许可以在第三张桌子上重复使用它（所有这些都在同一页上，请注意）。

如何更改此代码然后＆＃34;传递＆＃34;我的桌子呢？我确信这很容易，我只是想不出这对Google的写字。

谢谢！

- = Dave = -

Answer 1

我假设每个表都有一个唯一的ID ...所以在下面的示例中，您有log_table，另一个名为log_table2的表，以及第三个名为log_table3的表。

animateTable("log_table");
animateTable("log_table2");
animateTable("log_table3");

function animateTable(tableName){
    $("#" + tableName +" tr.new_row").each(function (){
       var oldBGcolor = $(this).css("background-color");
       $(this).animate({backgroundColor: "#FFFF33"}, "fast").delay(3000).animate({backgroundColor: oldBGcolor}, 3000).removeClass("new_row");
    });
}

或者添加一个类属性（在此示例中称为＆＃39; animate-table-class＆＃39;到每个表并使用此调用一次：

$(".animate-table-class tr.new_row").each(function (){
   var oldBGcolor = $(this).css("background-color");
   $(this).animate({backgroundColor: "#FFFF33"}, "fast").delay(3000).animate({backgroundColor: oldBGcolor}, 3000).removeClass("new_row");
});

Answer 2

更简单的方法是为每个表提供相同的类，例如“table-class”，然后执行

$("#log_table.table-class tr.new_row").each(function (){
   var oldBGcolor = $(this).css("background-color");
   $(this).animate({backgroundColor: "#FFFF33"}, "fast")
          .delay(3000)
          .animate({backgroundColor: oldBGcolor}, 3000)
          .removeClass("new_row");
});

Answer 3

只需将表ID作为参数传递

function highlightNewRows(tableId){
    $("#" + tableId + " tr.new_row").each(function (){
        var oldBGcolor = $(this).css("background-color");
        $(this).animate({backgroundColor: "#FFFF33"},"fast")
                .delay(3000)
                .animate({backgroundColor: oldBGcolor}, 3000)
                .removeClass("new_row");
    });
}

如何重用Jquery .each ....作为一个单独的方法来传递各种元素

3 个答案: