以前在做页面显示列表时候,要做一组数据
隔行变色,当时不知道,竟然用来了好多js脚本判断,写了许多像下面的例子。Html代码<table><%int c =0%>//
循环取列表<%if (c % 2 == 0){className = "一种
颜色"} else{className = "另外一种颜色"}c++%><tr lcass="className"><td></td></tr>//循环结束</table>后来直接用css控制:.Pop_TR{background-color:expression(this.rowIndex%2==0 ? "一种颜色":"另一种颜色")cursor:hand}这样,想展示上面的样式,只需要这样写:Html代码<table>//循环取列表<tr lcass="Pop_TR"><td></td></tr>//循环结束</table>css版只适用于低版本的IE,expression会死人的,如果页面很复杂。还不如前面的切换2个class的简单方法可靠。在高级浏览器中可以考虑使用css selector(流行的js库基本都实现了一套):tr:nth-child(2n+1) /* 奇数行 */tr:nth-child(odd) /* 奇数行 */tr:nth-child(2n+0) /* 偶数行 */tr:nth-child(even) /* 偶数行 */Jquery版:JQuery的话也很简单1.通过定义俩个class来实现$("tr:even").addClass("even-row")$("tr:odd").addClass("odd-row")2.或者一行代码$("tr").each(function(i){this.style.backgroundColor['#ccc','#fff'][i%2]})table控制:做个table奇偶行区别显示的css类就好了,这东西不复杂的<tbody><s:iterator id="ip" status="status" value="ipUseList"><tr class="<s:property value="#status.odd?'odd':'even'"/>"><td><s:property value="#ip.subnet"/></td><td><s:property value="#ip.netmask"/></td><td><s:property value="#ip.city_name"/></td>你不能写成这样吗,把里边的table放在外层table的行里
<table >
<tr>
<table></table>
</tr>
<tr>
<table></table>
</tr>
<tr>
<table></table>
</tr>
</table>
$("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]})
评论列表(0条)