jquery - 使用 jQuery 更新动态/ajax 表行的替代颜色

Question

一直在寻找但找不到，通过 jQuery 在$(document).ready事件上应用备用行颜色。

$(document).ready(function(){  

    //Member Directory Table  
    $('.MemberDetail table tr:odd ').css('background','#F0F0EC');  
}  

应用了颜色，但是当使用 ajax 请求更新表时，它不会更新颜色。那么将替代颜色应用于该表的更好方法是什么？

此页面上有一个示例：

这里动态表

Answer 1

当 Ajax 完成时，您应该使用此脚本。我的意思是

$.ajax({
  url: 'ajax/test.html',
  success: function(data) {
    //to do your jQuery code again;
    $('.MemberDetail table tr:odd ').css('background','#F0F0EC');
  }
});

Answer 2

在ajax请求之后，您必须再次执行表格颜色功能

function ajax() {
doAjaxStuff();

$('.MemberDetail table tr:odd ').css('background','#F0F0EC');
}

Answer 3

例如，如果您使用这样的CSS类：

.alternate
{
    background: #e6f4ff;
}

将替代颜色应用于表格行，它更容易......在jQuery动态添加表格行之后，您可以执行以下操作：

$("table tbody tr").removeClass("alternate").filter(":odd").addClass("alternate");

无论您做什么，这都应该使行正确着色：添加或删除<table>行。

请记住，每次<table>修改代码时，您都必须始终运行代码。

Answer 4

只需再次更新表格：

$('.MemberDetail table').find('tr:odd').css('background','#F0F0EC').end().find('tr:even').css('background','#fff');

没有神奇的方法可以自动维护这些颜色，每次更新表格时都必须更新。