table tr鼠标滑动变化背景色,复选框全选
<html>
<head>
??? <script language="javascript" src="./jquery.js" ></script>
??? <title>JS获取上传文件的绝对路径，兼容IE和FF</title>
??? <script>
$(function(){
?$(".datatable thead").addClass('title');
?? $(".datatable tbody tr:even").addClass('even');//偶数行，从0开始
?? $(".datatable tbody tr:odd").addClass('odd')//单数
?//鼠标滑过高亮
?$('.datatable tbody tr').bind('mouseover',function(){
??this.className='hover';
?? }).bind('mouseout',function(){
??
???if(this.rowIndex%2==0){
??? ???? this.className='even';
??? ????}else{
??? ???? this.className='odd';?
??? ????}
???
?? });
})
//全选
function checkall(checkmainname,checkename)
{
??? $(":checkbox[name='"+checkename+"']").attr("checked",$("#"+checkmainname).attr("checked"));
}
// 如果不是全部选中? 全选取消选中? 是全部选中 全选按钮选中
function childcheck(checkmainname,checkename)
{
?? if($(":checkbox[name='"+checkename+"']:checked").length>=$(":checkbox[name='"+checkename+"']").length){
???? $("#"+checkmainname).attr("checked","checked");
?? }else{
???? $("#"+checkmainname).removeAttr("checked");
??? }
?}?
??? </script>
<style type="text/css">
.title{ background:#00FF99;}
.even{ background: #ecf6fc; }
.odd{background:#E5ECF9}
.hover{ background:#4caee6; }
</style>
</head>
<body>
???
?
?<table width="100%" border="1" name="main" id="main" onclick="checkall('main','child')" /></th>
??? <th> </th>
??? <th> </th>
??? <th> </th>
??? <th> </th>
? </tr></thead>
? <tbody>
? <tr>
??? <td><input type="checkbox" name="child" value="${id}"
?????????????onclick="childcheck('main','child')" /></td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
? </tr>
? <tr>
??? <td><input type="checkbox" name="child" value="${id}"
?????????????onclick="childcheck('main','child')" /> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
? </tr>
? <tr>
??? <td><input type="checkbox" name="child" value="${id}"
?????????????onclick="childcheck('main','child')" /> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
? </tr>
? <tr>
??? <td><input type="checkbox" name="child" value="${id}"
?????????????onclick="childcheck('main','child')" /> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
??? <td> </td>
? </tr>
? </tbody>
</table>
</body>
</html>
