Javascript邮件管理

最新推荐文章于 2022-12-02 22:17:20 发布

wangbo910927

最新推荐文章于 2022-12-02 22:17:20 发布

阅读量658

点赞数

分类专栏：前端

前端专栏收录该内容

14 篇文章 0 订阅

订阅专栏

<!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=utf-8" />
<title>无标题文档</title>
<style type="text/css">
table {
border:#003 1px solid;
width:70%;
}
table td, table th {
border:#900 1px solid;
}
table th {
background:#090
}
.one {
background:#3F0
}
.two {
background:#C96
}
.over {
background:#0FF
}
</style>
<script type="text/javascript">

function trColor(){
var tabNode=document.getElementsByTagName("table")[0];
var trs=tabNode.rows;
var name;
for(var x=1;x<trs.length-1;x++){
if(x%2==1)
trs[x].className="one";
else trs[x].className="two";

trs[x].οnmοuseοver=function(){
name=this.className;
this.className="over";
}
trs[x].οnmοuseοut=function(){
this.className=name;
}
}

}
window.οnlοad=function(){
trColor();
}

function checkAll(index){
var allNode=document.getElementsByName("all")[index]
var mails=document.getElementsByName("mail");
for(var x=0;x<mails.length;x++){
mails[x].checked=allNode.checked

}
}

function checkBybut(num){
var mails=document.getElementsByName("mail");
for(var x=0;x<mails.length;x++){
if(num>1)mails[x].checked=!mails[x].checked;
else mails[x].checked=num;
}
}

function delMail(){
if(!window.confirm('是否删除所选的'))
{return}
var pp=new Array();
p=0;
var mails=document.getElementsByName("mail");
for(var x=0;x<mails.length;x++){
if(mails[x].checked){
var trNode=mails[x].parentNode.parentNode
pp[p++]=trNode;
}
}

for(x=0;x<pp.length;x++){
var trNode=pp[x];
trNode.parentNode.removeChild(trNode);
}
trColor();
}

</script>
</head>

<body>
<table>
<tr>
<th><input type="checkbox" name="all" οnclick="checkAll(0)" />
全选</th>
<th>发件人</th>
<th>邮件名称</th>
</tr>
<tr>
<td><input type="checkbox" name="mail" /></td>
<td>张三</td>
<td>新的邮件</td>
</tr>
<tr>
<td><input type="checkbox" name="mail" /></td>
<td>张四</td>
<td>新的邮件</td>
</tr>
<tr>
<td><input type="checkbox" name="mail" /></td>
<td>张五</td>
<td>新的邮件</td>
</tr>
<tr>
<td><input type="checkbox" name="mail" /></td>
<td>张六</td>
<td>新的邮件</td>
</tr>
<tr>
<th><input type="checkbox" name="all" οnclick="checkAll(1)"/>
全选</th>
<th colspan="2"> <input type="button" value="全选" οnclick="checkBybut(1)" />
<input type="button" value="取消全选" οnclick="checkBybut(0)" />
<input type="button" value="反选" οnclick="checkBybut(2)" />
<input type="button" value="删除所选" οnclick="delMail()" />
</th>
</tr>
</table>
</body>
</html>