主要是通过使用JQuery实现表格的简单隔行变色效果! <mce:style type="text/css"><!-- tr{ height: 30px; font-size: 14px; } TH{ background: olive; } .dan{ background: #ddffff; } .shuang{ background: #DEEFDD; } .over{ background: white; } --></mce:style><style type="text/css" mce_bogus="1">tr{ height: 30px; font-size: 14px; } TH{ background: olive; } .dan{ background: #ddffff; } .shuang{ background: #DEEFDD; } .over{ background: white; }</style> <mce:script type="text/javascript" src="js/jquery-1.4.2.min.js" mce_src="js/jquery-1.4.2.min.js"></mce:script> //首先是引入JQuery的文件。src的目录根据自己的JQuery文件存放的位置改变一下,还有文件名。(别到最后改了个路径然后下个1.3的版本,来问我怎么用1.4.2说找不到。) <mce:script type="text/javascript"><!-- $(document).ready(function(){ $('#jquery tr').addClass('dan'); //jquery 是我设置的一个表格ID,因为一个页面里面可能有很多表格,我只需要一个表格实现单双行变色而已。 (假如是页面里面所有表格都实现单双行变色,可以这样访问:$("tr").addClass("className")) $('#jquery tr:even').addClass('shuang'); //奇偶变色,添加样式 $("#jquery tr").hover( function(){ //执行这个函数,表明鼠标移动到当前行的时候,需要实现哪些操作。 $(this).addClass("over"); //给当前行增加变色。 }, function(){ //执行这个函数,表明鼠标移出当前行的时候,需要实现哪些操作。 $(this).removeClass("over"); //把样式还原到原来的颜色 } ); }); // --></mce:script> <table id="jquery" align="center" width="800" cellpadding="0" cellspacing="0" border="0"> <col align="center"> <col align="center"> <col align="center"> <col align="center"> <TR> <TH>Name</TH> <TH>DeptMent</TH> <TH>Phone</TH><TH>Mobile</TH> </TR> <tr> <td>123</td><td>123</td><td>123</td> <td>123123</td></tr> *******************************