jquery表格隔行变色代码推荐

jquery隔行变色，jquery表格隔行变色代码。大家新建一个HTML文件，复制或者认真分析下面的代码就熟悉怎么使用jquery实现表格隔行变色了。

代码：

http://www.w3.org/TR/html4/strict.dtd">



表格隔行背景和突出显示当前行


body{ margin:0 auto; font-size:12px;}
.data_list td{ width:100px;}


/* 当鼠标移到表格上是，当前一行背景变色 */
$(document).ready(function(){
$(".data_list tr td").mouseover(function(){
$(this).parent().find("td").css("background-color","#d5f4fe");
});
})
/* 当鼠标在表格上移动时，离开的那一行背景恢复 */
$(document).ready(function(){
$(".data_list tr td").mouseout(function(){
var bgc = $(this).parent().attr("bg");
$(this).parent().find("td").css("background-color",bgc);
});
})
$(document).ready(function(){
var color="#ffeab3"
$(".data_list tr:odd td").css("background-color",color); //改变偶数行背景色
/* 把背景色保存到属性中 */
$(".data_list tr:odd").attr("bg",color);
$(".data_list tr:even").attr("bg","#fff");
})




100 100 100 100 100
100 100 100 100 100
100 100 100 100 100
100 100 100 100 100
100 100 100 100 100
100 100 100 100 100
100 100 100 100 100
100 100 100 100 100

猜你喜欢