html当前行突出显示,用JQuery实现表格隔行变色和突出显示当前行的代码

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

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