<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>选中表格行变色标记效果</title>
<style type="text/css">
<!--
#ejiaA1 {
width: 550px;
border-top: #E3E3E3 1px solid;
border-left: #E3E3E3 1px solid;
}
#ejiaA1 td,#ejiaA1 th {
padding: 5px;
border-right: #E3E3E3 1px solid;
border-bottom: #E3E3E3 1px solid;
font-size: 12px;
height: 16px;
line-height: 16px;
}
#ejiaA1 tr td span {
color: #686868
}
#ejiaA1 tr td span.st1 {
color: #ff0000
}
-->
</style>
<script language="javascript">
<!--
//ejiaA1("表格名称","奇数行背景","偶数行背景","鼠标经过背景","点击后背景");
function ejiaA1(o,a,b,c,d){
var t=document.getElementById(o).getElementsByTagName("tr");
for(var i=0;i<t.length;i++){
t[i].style.backgroundColor=(t[i].sectionRowIndex%2==0)?a:b;
t[i].onclick=function(){
if(this.x!="1"){
this.x="1";
this.style.backgroundColor=d;
}else{
this.x="0";
this.style.backgroundColor=(this.sectionRowIndex%2==0)?a:b;
}
}
t[i].onmouseover=function(){
if(this.x!="1")
this.style.backgroundColor=c;
}
t[i].onmouseout=function(){
if(this.x!="1")
this.style.backgroundColor=(this.sectionRowIndex%2==0)?a:b;
}
}
}
-->
</script>
</head>
<body>
<table width="500" border="0" cellspacing="0" cellpadding="0" id="ejiaA1">
<tr>
<th>接入方式</th>
<th>上网时间</th>
<th>下网时间</th>
<th>上网时长</th>
</tr>
<tr>
<td>宽带接入</td>
<td>2008-4-23 12:40:18</td>
<td>2008-4-23 14:50:28</td>
<td>2小时10分10秒</td>
</tr>
<tr>
<td>宽带接入</td>
<td>2008-4-23 12:40:18</td>
<td>2008-4-23 14:50:28</td>
<td>2小时10分10秒</td>
</tr>
<tr>
<td>宽带接入</td>
<td>2008-4-23 12:40:18</td>
<td>2008-4-23 14:50:28</td>
<td>2小时10分10秒</td>
</tr>
<tr>
<td>宽带接入</td>
<td>2008-4-23 12:40:18</td>
<td>2008-4-23 14:50:28</td>
<td>2小时10分10秒</td>
</tr>
<tr>
<td>宽带接入</td>
<td>2008-4-23 12:40:18</td>
<td>2008-4-23 14:50:28</td>
<td>2小时10分10秒</td>
</tr>
<tr>
<td>宽带接入</td>
<td>2008-4-23 12:40:18</td>
<td>2008-4-23 14:50:28</td>
<td>2小时10分10秒</td>
</tr>
</table>
<script language="javascript">
<!--
ejiaA1("ejiaA1","#fff","#F5F5F5","#FFFFCC","#FFFF84");
-->
</script>
</body>
</html>
分享到：
相关推荐
devexpress表格控件gridcontrol设置隔行变色、焦点行颜色、设置（改变）显示值、固定列不移动（附源码）
10.11 选中表格行前的复选框则行变色 10.12 用JavaScript生成面包屑导航 10.13 复选框的反选 10.14 选中所有复选框 10.15 复选框全选（二） 10.16 改变slsect选中项的颜色特效 第11章 颜色处理和菜单特效 11.1 背景...
10.11 选中表格行前的复选框则行变色 10.12 用JavaScript生成面包屑导航 10.13 复选框的反选 10.14 选中所有复选框 10.15 复选框全选（二） 10.16 改变slsect选中项的颜色特效 第11章 颜色处理和菜单特效 11.1 背景...
实例195 选中的行变色 302 7.2 对单元格的焦点进行控制 303 实例196 选定表格中的单元格 303 实例197 左右移动单元格的信息 304 实例198 通过键盘使单元格焦点任意移动 306 7.3 对表格的行、列进行修改 311 实例199 ...
实例015 使用“/”标记给代码段添加说明 18 2.2 运算符的使用 20 实例016 使用引号运算符进行赋值 20 实例017 使用算术运算符开发简单计算器 21 实例018 使用“^”运算符对数字进行加密 22 实例019 巧用位移运算符...
使用microsoft.web.ui.webcontrols的TabStrip与IFame组件,达到页的切换效果 HttpModule 实现 ASP.Net (*.aspx) 中文简繁体的自动转换,不用修改原有的任何代码,直接部署即可! 服务器自定义开发二之客户端脚本回发 Web...