2012-05-30 45 views
0

你好朋友我想改變每個<tr>的背景顏色我試圖做同樣的沒有得到結果我知道我的代碼中有一些問題。請幫我出表格顏色變化

以下是在線DEMO

我的代碼檢查腳本

var b = new Array('col_one','col_two','col_three'); 

$('#tbl tr').each(function(){ 

var a = 0; 

$('#tbl tr').addClass(b[a]) 

a++; 


}) 

CSS

.col_one 
{ 
    background:#000099; 
} 
.col_two 
{ 
    background:#009966; 
} 
.col_three 
{ 
    background:#663333; 
} 

HTML

<table width="100%" border="1" cellspacing="0" cellpadding="0" id="tbl"> 
    <tr> 
    <td>&nbsp;</td> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    </tr> 
</table> 

回答

1

現在正在工作。

http://jsfiddle.net/QnVdE/3/

+0

嗨@MajoB感謝您的幫助。即時通訊設法粘貼您的cpde在我的網頁,但它沒有給出相同的結果plz檢查我的代碼,並告訴我什麼是我的代碼在這裏的問題在線演示鏈接http://jsfiddle.net/QnVdE/7/ ... ..對不起,請求更多 – Kamal

+1

@Kamal我的代碼不工作? :o我剛剛做了一些編輯 –

+0

感謝@SiGanteng的幫助 – Kamal

3

那是因爲你被宣佈a0在每次迭代,可以將變量傳遞到each的匿名函數來獲取元素的索引被迭代:

$('#tbl tr').each(function(idx){ 

    // $(this) refers to the jQuery object of each tr 
    $(this).addClass(b[idx%3]); // re-use colors when idx > 3 
}) 

http://jsfiddle.net/QnVdE/2/

+0

感謝您的幫助,但我想申請上''不斷代碼只適用於第3'' – Kamal

+0

@Kamal我做了一個編輯CSS,你看到了嗎?帶'idx%3'的部分 –

+0

@Kamal http://jsfiddle.net/QnVdE/2/ –

0
var b = new Array('col_one','col_two','col_three'); 
var a = 0; 
$('#tbl tr').each(function(){ 
if(a > 2){a=0;} 
$(this).addClass(b[a]); 

a++; 


}) 
+1

不工作http://jsfiddle.net/QnVdE/4/ –

0
var b = ['col_one','col_two','col_three']; 
var a = 0; 
$('#tbl tr').each(function(){ 
    $(this).addClass(b[a % b.length]); 
    a++; 
});