定时操作应用之——延时生效按钮
ex.html如下：
代码
代码
1 <html>
2 <head>
3 <title>延时生效按钮</title>
4 <style type="text/css">
5 * {margin:0}
6 body {text-align:center;min-width:760px}
7 div {padding:3px 3px 3px 3px}
8 #main {width:720px;margin:0 auto;text-align:left;margin-top:30px}
9 </style>
10
11 <script type="text/javascript">
12 function $(id) {
13 return document.getElementById(id);
14 }
15
16 // 等待时间
17 var remain = 10;
18 function init() {
19 $("btn").innerHTML = "提交(" + (remain--) + "秒)";
20 if(remain>0) {
21 window.setTimeout(init,1000);
22 } else {
23 $("btn").disabled = false;
24 $("btn").innerHTML = "提交";
25 }
26 }
27 </script>
28 </head>
29 <body onload="init()">
30 <div>
31 <button id="btn" disabled="disabled"
32 style="width:150px;height:40px;font-size:large">提交</button>
33 </div>
34 </body>
35 </html>
2 <head>
3 <title>延时生效按钮</title>
4 <style type="text/css">
5 * {margin:0}
6 body {text-align:center;min-width:760px}
7 div {padding:3px 3px 3px 3px}
8 #main {width:720px;margin:0 auto;text-align:left;margin-top:30px}
9 </style>
10
11 <script type="text/javascript">
12 function $(id) {
13 return document.getElementById(id);
14 }
15
16 // 等待时间
17 var remain = 10;
18 function init() {
19 $("btn").innerHTML = "提交(" + (remain--) + "秒)";
20 if(remain>0) {
21 window.setTimeout(init,1000);
22 } else {
23 $("btn").disabled = false;
24 $("btn").innerHTML = "提交";
25 }
26 }
27 </script>
28 </head>
29 <body onload="init()">
30 <div>
31 <button id="btn" disabled="disabled"
32 style="width:150px;height:40px;font-size:large">提交</button>
33 </div>
34 </body>
35 </html>
