jquery 控制表格或者列表 偶数行的颜色

demo7:table滑过变色,隔行变色.
$(document).ready(function(){ //这个就是传说的ready
$(".stripe tr").mouseover(function(){
//如果鼠标移到class为stripe的表格的tr上时，执行函数
$(this).addClass("over");}).mouseout(function(){
//给这行添加class值为over，并且当鼠标一出该行时执行函数
$(this).removeClass("over");}) //移除该行的class
$(".stripe tr:even").addClass("alt");
//给class为stripe的表格的偶数行添加class值为alt
});
在效果上,我又加了点击 某行 变色:
$(document).ready(function(){ //这个就是传说的ready
$(".stripe tr").mouseover(function(){
//如果鼠标移到class为stripe的表格的tr上时，执行函数
$(this).addClass("over");}).mouseout(function(){
//给这行添加class值为over，并且当鼠标一出该行时执行函数
$(this).removeClass("over");}).click(function(){ //移除该行的class
$(this).toggleClass("click").removeClass("alt")})//点击变色,注意：因为有隔行变色，所以这里必须在触发toggleClass时,remove("alt").
$(".stripe tr:even").addClass("alt");
//给class为stripe的表格的偶数行添加class值为alt
});
说到这里 ，不得不说一下 toggle与toggleClass区别：
$(document).ready(function(){ //这个就是传说的ready
$(".stripe tr").mouseover(function(){
//如果鼠标移到class为stripe的表格的tr上时，执行函数
$(this).addClass("over");}).mouseout(function(){
//给这行添加class值为over，并且当鼠标一出该行时执行函数
$(this).removeClass("over");}).toggle(function(){ $(this).addClass("click"); },function(){ $(this).removeClass("click");}).unbind("click")
$(".stripe tr:even").addClass("alt");
//给class为stripe的表格的偶数行添加class值为alt
});
可以发现：
toggleClass：可以发现超连接还是可以连接的，没有被 toggle和click占用
toggle：可以发现超连接已经不可以用了，所以说toggle不适合这种情况。不过可以把click解绑(unbind("click"))，代码量好象比click结合toggleClass多，所以我选择的是toggleClass.

来自: http://hi.baidu.com/hbjinzhao/blog/item/7609123b481d33e714cecb2c.html

转载于:https://www.cnblogs.com/yinyao/archive/2011/06/17/2083621.html