jQuery实现table隔行换色和鼠标经过变色

Original 2016-11-08 11:14:38 341
abstract:一、隔行换色$("tr:odd").css("background-color","#eeeeee");  $("tr:even").css("background-color","#ffffff");或者一行搞定:$("table tr:nth-c

一、隔行换色

$("tr:odd").css("background-color","#eeeeee"); 
$("tr:even").css("background-color","#ffffff");

或者一行搞定:

$("table tr:nth-child(odd)").css("background-color","#eeeeee");

:nth-child 匹配其父元素下的第N个子或奇偶元素

二、鼠标经过变色 

$("tr").live({ 
    mouseover:function(){ 
        $(this).css("background-color","#eeeeee"); 
    }, 
    mouseout:function(){ 
        $(this).css("background-color","#ffffff"); 
    } 
})

或者  

$("tr").bind("mouseover",function(){ 
    $(this).css("background-color","#eeeeee"); 
}) 
$("tr").bind("mouseout",function(){ 
    $(this).css("background-color","#ffffff"); 
})

当然live()和bind()都可以同时绑定多个事件或分开。


Release Notes

Popular Entries