爲多個表着色奇數行

如果我在一個頁面上有多個表，並且嘗試給奇數行着色，jQuery似乎會將整個TR組（從所有表中）合併在一起，當它確定哪個行很奇怪。爲多個表着色奇數行

見例如：http://jsfiddle.net/ryjennings/KNmuQ/5/

有沒有辦法從這樣停止jQuery和分別處理每個表？

2012-01-06 RyJ

只是一個供參考 - CSS3可以做到這一點，但它在<= IE8中不起作用。使用'tr：nth-child（odd）td'。以下是支持的瀏覽器的完整列表：http://caniuse.com/css-sel3 – 2012-01-06 20:05:58

在現代瀏覽器中，您可以使用純CSS完成此操作：http://jsfiddle.net/mblase75/KNmuQ/22/ – Blazemonger 2012-01-06 20:06:57

你可以這樣做，而不是：

$(document).ready(function() { 
    $("table").find("TR:even").addClass("odd"); 
});

基本上，你原來的選擇是抓住一組包含的所有頁面，這是所有的人都在table元素tr元素，然後採取一切其他一個龐大的集合。新的選擇器系列首先創建一組所有的表格，然後創建每個表格中的行的子組，然後每個子組中的每行都有一個。

來源

2012-01-06 19:59:12

完美！這工作，謝謝！ – RyJ 2012-01-06 20:01:50

這是你可以做的一種方式：

$("table").each(function(){ 
    $("tr:even", this).addClass("odd"); 
});

來源

2012-01-06 20:00:20

呃，這裏不需要'.each（）'。 – 2012-01-06 20:03:06

@MДΓΓБДLL好吧...如果我使用find方法，也許不會，但是由於我使用的語法，這是必要的。我已經提出了David的答案。這只是作爲一種可能的選擇。 – 2012-01-06 20:08:48

$(document).ready(function() { 
    $("table").each(function(){ 
     $(this).find('TR:even').addClass("odd"); 
    }); 
});

來源

2012-01-06 20:01:59

呃，這裏不需要'.each（）'。 – 2012-01-06 20:02:58

是的，你是對的。 – 2012-01-06 20:08:58

你不應該使用JavaScript的任何東西，你可以用CSS做。 CSS的速度要快幾個數量級。你需要的是:nth-child psudo-class：

tr:nth-child(odd) { background:#f5f6f8; }

See Fiddle.

來源

2012-01-06 20:06:26

爲了記錄，我絕對同意你的看法。我的回答只是對糾正jQuery代碼片段的請求做出的迴應，而不一定是使用jQuery而不是CSS或vanilla JavaScript的建議。但是，應該注意的是，在一些仍然非常常見的瀏覽器（包括IE 8及以下版本）中不支持n-child。 – 2012-01-06 22:01:35

我們的答案+] Modernizr]（http://www.modernizr.com/）是理想的跨瀏覽器解決方案。 – 2012-01-07 00:10:38

這一個進程相對行父表，而不是你所使用的代碼...

$(document).ready(function() { 
    $("tr:nth-child(even)").each(function() { 
     $(this).addClass('odd'); 
    }); 
});

來源

2012-01-06 20:12:39

爲多個表着色奇數行

回答

相關問題