- 爱易网页
-
JavaSript
- js记时10秒
日期:2014-05-16 浏览次数:20374 次
js倒计时10秒
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>Time bomb</title>
<style type="text/css">
#t2{display:none;}
</style>
</head>
<body>
<div id="test">
<input id="t1" type="button" onclick="detonate();" value="引爆定时zd" />
<input id="t2" type="button" onclick="demolite();" value="拆除定时zd" />
</div>
</body>
</html>
<script type="text/javascript">
var x = document.getElementById("test");
var x2 = document.getElementById("t1");
var x3 = document.getElementById("t2");
var c = 10;
var timeId1 = 0;
function detonate(){
x3.style.display = "inline";
x2.value = "倒计时";
x2.value += c--;
if(c >= 0){
timeId1 = window.setTimeout(detonate,1000);
}else{
x2.style.display = "none";
x3.style.display = "none";
bomb = document.createElement("div");
bomb.innerHTML = "<img src='images/after/bomb.jpg' alt='bomb' />";
document.body.appendChild(bomb);
}
}
function demolite(){
window.clearTimeout(timeId1);
x3.style.display = "none";
alert("恭喜,zd拆除成功");
x2.value = "继续";
}
</script>
免责声明: 本文仅代表作者个人观点,与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。