<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>邮件发送</title>
<script type="text/javascript">
var id;
var p;
//发送
function send() {
//若id非空则定时器已启动过,那么就不要再启动了
if(id){
return;
}
//显示正在发送
p=document.getElementById("msg");
p.innerHTML="正在发送";
//推迟3秒显示已发送
id=setTimeout(function(){
p.innerHTML="已发送";
id=null;
}, 3000)
}
//撤销
function cancel() {
//id非空时,表示定时器已启动才可以撤销
if(id){
//显示为已撤销
p=document.getElementById("msg");
p.innerHTML="已撤销"
clearTimeout(id);
//为了下次可以启动,要清空id;
id=null;
}
}
</script>
</head>
<body>
<p>
<input type="button" value="发送"
onclick="send();">
<input type="button" value="撤销"
onclick="cancel();">
</p>
<p id="msg"></p>
</body>
</html>