錶行奇/偶復位

我使用這個：錶行奇/偶復位

jQuery("tr:odd").css("background-color", "#f5f5f5"); 
jQuery("tr:even").css("background-color", "#ececec");

只是簡單地增加一個背景顏色交替錶行，工作正常。問題是，如果在同一個頁面中有多個表格，它只是不斷重複每個表格而不是重新設置每個表格並重新開始。我的th背景顏色與我的偶數行顏色相同所以最終它追上了我有一個th和tr是相同的顏色，因此它看起來像一個大排。

如何使用jquery的這兩行，但是如果有多個表，可以重新啓動頁面上的每個表格？

來源

2013-05-29 AndyWarren

有你使用jQuery這樣一個特別的原因，而不是單純的CSS？ – cimmanon

僅用於跨瀏覽器兼容性。沒想到'n-child'完全被支持，特別是在IE的老版本中。我錯了嗎？ – AndyWarren

[IE9 +支持nth-child]（http://msdn.microsoft.com/zh-cn/library/hh781508（v = vs.85）.aspx）。在較新的版本中，jQuery已經不再支持比IE9更早的東西了：http://jquery.com/browser-support/ – cimmanon

開始通過選擇表，然後找到子行：

jQuery("table").find("tr:odd").css("background-color","#f5f5f5");

http://jsfiddle.net/mblase75/xgQ8Q/

Vega's answer使用具有更少的字符相同的方法。

來源

2013-05-29 19:03:17 Blazemonger

完美。我會盡快接受，再說12分鐘。 – AndyWarren

這仍然適用於我所有的表格。你可以用ID來引用特定的表嗎？ – Vippy

想通了，我可以使用ID標籤：jQuery（「＃myTable tr：odd」）。css（「background-color」，「＃EFF3FB」）; – Vippy

嘗試在像下面環境中使用table，

jQuery("tr:odd", 'table').css("background-color", "#f5f5f5"); 
jQuery("tr:even", 'table').css("background-color", "#ececec");

來源

2013-05-29 19:03:57

感謝您的快速回答。這也起作用了，所以我會拋出一個贊成票。剛剛碰到Blazemonger的答案。 – AndyWarren

@AndyWarren同意。 –

jQuery("table tr:nth-child(odd)").css("background-color", "red"); 
jQuery("table tr:nth-child(even)").css("background-color", "yellow");

http://jsfiddle.net/xgQ8Q/5/

來源

2013-05-29 19:27:15 Johnny5

+1。我沒有想到使用'：nth-child（odd）'而不是'：odd'會給出不同的結果。 – Blazemonger

錶行奇/偶復位

回答

相關問題