使用js 给表格奇偶行添加背景颜色
效果图:
<table>
<tbody>
<tr>
<td colspan="3">1</td>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td colspan="3">2</td>
<td>21</td>
<td>22</td>
</tr>
<tbody>
</table>
如果给这样的跨行表格添加背景颜色 不能整行的添加 不然会有点难。下面是我实现的
function changeColor_s(){
if($(".tab_new tr").length>1){
$(".tab_new tr").each(function(){
var num=$(this).children("td").length;
if(num==7){
$(this).children("td").eq(0).css("background","#FFF");
}
})
}
}
$(function() {
changeColor();
$(".tab_new tr").hover(function() {
$(this).css("background", "#E1F1FB").css("cursor", "auto");
changeColor_s();
},function(){
changeColor();
});
});
function changeColor(){
$(".tab_new").each(function () {
var _this = $(this);
//奇数行
_this.find("tr:even").css("background", "#fff").css("cursor", "auto");
//偶数
_this.find("tr:odd").css("background", "#F5F9FB").css("cursor", "auto");
});
changeColor_s();
}