jquery奇数/偶数问题prepend/append

我成功地使用jQuery的奇数/偶数选择器创建一个“虎条” 表中。然后我添加了添加或删除行的功能。不过，我并不是能够使条带在添加/删除行时正常工作。它适用于添加/附加，但不适用于添加/前缀或删除。下面是代码的总结...jquery奇数/偶数问题prepend/append

$(document).ready(function(){ 

    // click on Add Row button 
    $("#addButton").click(function(){ 
     // add a row to table 
     addTableRow('#myTable');       
     // then re-apply tiger striping 
     stripeRows(); 
    }); 
}); 


// remove specified row 
function removeRow(row) { 
    $(row).parent("tr").remove(); 
    stripeRows(); 
} 


function StripeRows() 
{ 
    $("#myTable").each(function(){ 
     $(this).find("tr:even").addClass("evenrow"); 
     $(this).find("tr:odd").addClass("oddrow"); 
    }); 
}

来源

2010-01-02 rshid

您需要首先清除先前的分拆：

function StripeRows() 
{ 
    $("#myTable").each(function(){ 
     $(this).find("tr").removeClass('evenrow oddrow'); 
     $(this).find("tr:even").addClass("evenrow"); 
     $(this).find("tr:odd").addClass("oddrow"); 
    }); 
}

否则你会同时具有evenrow和oddrow类行结束。

来源

2010-01-02 01:58:18

这可能不起作用，可能是因为你没有删除旧的类。

我有两点建议：

不要使用:even和:odd。这些通常不会达到您的预期。分别使用:nth-child(even)和:nth-child(odd);和
不要同时存在奇数类。你不需要他们两个。只需使用一个奇怪的（或者甚至是）课堂，让桌子的风格覆盖另一个案例。

所以，你应该做这样的事情：

function StripeRows() { 
    $("#mytable > tbody > tr").removeClass("oddrow") 
    .filter(":nth-child(odd)").addClass("oddrow"); 
}

此功能，从下表中的所有行删除“oddrow”类，然后添加“oddrow”班奇表中的行。

如果你还是想oddrow/evenrow（恕我直言，这只是增加了额外的不必要的代码），它是没有太大的变化：

function StripeRows() { 
    $("#mytable > tbody > tr").removeClass("oddrow evenrow") 
    .filter(":nth-child(odd)").addClass("oddrow") 
    .end().filter(":nth-child(even)").addClass("evenrow"); 
}

来源

2010-01-02 01:58:25 cletus

辉煌！谢谢。 – rshid 2010-01-02 02:23:46

也许你应该先试试这个？

$(this).find("tr").removeClass();

来源

2010-01-02 01:59:24

jquery奇数/偶数问题prepend/append

回答

相关问题