使用jquery删除行时,nth-child css不会重绘

Question

我有一个jsfiddle,在这里演示了这个问题:http://jsfiddle.net/xjmwY/

基本上,我有一个使用nth-child(奇数)规则的css3斑马条纹表.

.myTable tr {
    background-color: #efefef;
}
.myTable  tr:nth-child(odd) {
    background-color: #fff;
}

当通过jquery删除一行时,我最终得到两个颜色相同的后续行.有没有办法让桌子重新粉刷？

Answer 1

.fadeOut()只是隐藏行(将其淡化为透明然后将显示设置为无),但它并没有真正删除它.要做到这一点.remove():

$("tr").click(function(event) {
  event.preventDefault();
  $("#row_2").remove();
});

jsFiddle例子

如果不能选择删除行,则可以按可见的行和不同的行过滤行:

$("#row_2").fadeOut(function () {
    $('tr:visible').filter(":odd").css('background', '#fff');
});