使用jQuery设置备用行的颜色？

Question

我试图使用查询来设置html表的备用行的颜色.但是每次我添加一个新的行查询都会切换整个表的颜色.这是我正在使用的Javascript代码:

var alternate = true;
function addRow(data) {
    if(alternate){
        $("table.live_feed").find('tbody.main').prepend(data).css("background", "#f1f1f1");
        alternate = false;
    }else{
        $("table.live_feed").find('tbody.main').prepend(data).css("background", "white");
        alternate = true;
    }
}

PS:我在Stack Overflow上看起来像是一些类似的问题,他们改变了奇数行或偶数行的颜色.我不想更改已存在的行的颜色,我只想更改要添加的新行的颜色.

Answer 1

您.css正在对找到的项目(tbody.main)执行操作,而不是您希望它对数据执行操作:

var data = $(data).css("background", "#f1f1f1");
$("table.live_feed").find('tbody.main').prepend(data);

作为旁注,对于交替的行颜色,您可以使用选择器:odd和:even

例:

$('tr:odd').css('background', 'lightgray');