日期:2014-05-17  浏览次数:20677 次

使用jQuery使HTML中的table奇偶行变色

?

?

使用jQuery实现,奇偶行变色的小例子:

?

以下是部分HTML代码:

<table id="t" border="1" cellspacing="0px" cellpadding="0px" align="center" width="100%">
    <tr  style="color:yellow;background-color:blue">
      <th>请选择</th>
       <th>用户编号</th>
       <th>用户姓名</th>
       <th>用户性别</th>
       <th>用户年龄</th>
       <th>所属部门</th>
       <th>执行修改</th>
       <th>查看详细</th>
    </tr>
    
    <logic:iterate id="emp" name="MapUsers" property="UserList">
     <tr>
      <td align="center"><input type="checkbox" name="chk" value="${emp.userid }" onclick="get_onclick(this)"></td>
      <td align="center">${emp.userid }</td>
       <td align="center">${emp.username }</td>
       <td align="center">${emp.sex }</td>
       <td align="center">${emp.age }</td>
       <td align="center">${emp.dept.dname }</td>
       <td align="center"><A href="#">修改</A></td>
       <td align="center"><A href="#">详细信息</A></td>
     </tr>
    </logic:iterate>
  </table>

?

?

javascript代码:

//奇数行换颜色;
		onload = function(){
			jQuery("#t>tbody>tr:odd").css("backgroundColor","LightCyan");
		}

?