jquery - 表格行颜色改变

Question

你好朋友我想改变每一个<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>

Answer 1

那是因为您声明a在0每次迭代时，您可以将变量传递给 anon 函数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/

Answer 2

它现在正在工作。

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

Answer 3

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++;


})

Answer 4

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