<script type="text/javascript"> $(function(){ $("table tr:even").addClass("tdOdd"); $("th:first").css("background","#B4C6C1");//首个 $("table tr").mouseover(function(){ $(this).addClass("tdOver");}).mouseout(function(){ $(this).removeClass("tdOver");}).click(function(){//荧光棒 $(".tdClick").removeClass("tdClick");$(this).addClass("tdClick"); })//行锁定 $("input:checkbox:first").click(function(){ $("input:checkbox:not(input:checkbox:first)").each(function(){//剔除本身 $(this).attr( "checked",$("input:checkbox:first").attr("checked")); }) }) $("input:checkbox:not(input:checkbox:first)").click(function(){ var flag=true; $("input:checkbox:not(input:checkbox:first)").each(function(){ if(!this.checked){flag=false;}//不可使用if($(this).attr("checked","false")){flag=false;} }); $("input:checkbox:first").attr("checked",flag); }) }); </script> <style type="text/css"> body{ font-size:12px; color:#366; } table{ border:none; background:#fefefe; width:100%; border-collapse:collapse; } th{ background:#CFDEC6; padding:4px; color:#000; } td,.tdNormal{ border:#cfdec6 solid 1px; padding:4px; background:fefefe; } .tdOdd{ background:#f1fefa; } .tdOver{ background:#F5FAF7; } </style> <body> <table> <tr> <th>姓名</th> <th>年龄</th> <th>专业</th> </tr> <tr> <td>王洪剑</td> <td>22</td> <td>电气自动化</td> </tr> <tr> <td>李川川</td> <td>20</td> <td>计算机</td> </tr> <tr> <td>陈超</td> <td>22</td> <td>计算机</td> </tr> <tr> <td>秦玉龙</td> <td>21</td> <td>计算机</td> </tr> <tr> <td>刘威</td> <td>21</td> <td>计算机</td> </tr> <tr> <td>张会会</td> <td>21</td> <td>计算机</td> </tr> <tr> <td>胡海生</td> <td>30</td> <td>计算机</td> </tr> <tr> <td>吴雄</td> <td>22</td> <td>计算机</td> </tr> </table> </body>