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

回答

相關問題