本帖最后由 秦兰之 于 2013-6-8 05:41 编辑
<html>
<head>
<title> New Document </title>
<style type="text/css">
table,table th, table td{
border:#0066FF 1px solid;
width:600px;
}
table th{
background-color:#99FF00;
}
table td{
text-align:center;
}
.one{
background-color:#00FFCC;
}
.two{
background-color:#FC6;
}
.over{
background-color:#0C9;
}
</style>
<script type="text/javascript">
var name;
function trColor()
{
var tabNode=document.getElementById("mailid");
var trs=tabNode.rows;
for(var x=0; x<trs.length-1; x++)
{
if(x%2==1)
trs[x].className="one";
else
trs[x].className="two";
//鼠标悬停的时候要先进入原来的样式，紧跟着再设置新的样式；就要定义一个变量。
trs[x].onmouseover=function()
{
name=this.className;
this.className="over";
};
trs[x].onmouseout=function()
{
name=this.className;
};
}
}
window.onload=function() //匿名事件。//这里就是59行。
{
trColor();
}
</script>
</head>
<body>
<table id="mailid">
<th><input type="checkbox" />全选</th>
<th>发件人</th>
<th>邮件名称</th>
<th>邮件附属信息</th>
<tr>
<td><input type="checkbox" /></td>
<td>张三11</td>
<td>我是邮件11</td>
<td>我是附属信息11</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三12</td>
<td>我是邮件12</td>
<td>我是附属信息12</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三13</td>
<td>我是邮件13</td>
<td>我是附属信息13</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三14</td>
<td>我是邮件14</td>
<td>我是附属信息14</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三15</td>
<td>我是邮件15</td>
<td>我是附属信息15</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三16</td>
<td>我是邮件16</td>
<td>我是附属信息16</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三17</td>
<td>我是邮件17</td>
<td>我是附属信息17</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三18</td>
<td>我是邮件18</td>
<td>我是附属信息18</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三19</td>
<td>我是邮件19</td>
<td>我是附属信息19</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三b111</td>
<td>我是邮件b111</td>
<td>我是附属信息b111</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三b2</td>
<td>我是邮件b2</td>
<td>我是附属信息b2</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三a1</td>
<td>我是邮件a1</td>
<td>我是附属信息a1</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三a2</td>
<td>我是邮件a2</td>
<td>我是附属信息a2</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三a3</td>
<td>我是邮件a3</td>
<td>我是附属信息a3</td>
</tr>
<tr>
<td><input type="checkbox" /></td>
<td>张三a4</td>
<td>我是邮件a4</td>
<td>我是附属信息a4</td>
</tr>
<th><input type="checkbox"/>全选
</th>
<th colspan="3">
<input type="button" value="全选" />
<input type="button" value="取消全选" />
<input type="button" value="反选" />
<input type="button" value="删除所选附件" />
</th>
</table>
</body>
</html>
|
|
收藏
淘帖
踩
