<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>倒计时确定</title> <style> *{ margin:0;} #a01{ background-color:#921; margin-left:220px; font-size:400px; font-family:Old English Text MT; } #a02{ font-size:260px; background-color:#666; font-family:华文行楷; } #a01,#a02 { 550px; height:500px; border:5px solid #222; margin-top:100px; text-align:center; vertical-align:middle; line-height:500px; border-radius:50px; float:left; } </style> </head> <body> <div id="a01" onclick="Ks()"> 10 </div> <input disabled="disabled" type="button" value="确定" id="a02" /> </body> </html> <script> var d= document.getElementById("a02"); // 找到id名"a02" d.setAttribute("disabled","disabled"); //把d的属性重置为disabled; function Ks()//点击事件,触发倒计时 { var a =10;//从10开始倒计时 var b=window.setInterval(c,1000);//调用函数里的函数名不加引号括号当做变量引用; // 间隔 执行 函数c() 间隔1s; function c() { a--;//每执行一次a的值-1; document.all.a01.innerHTML=a;//找到全部元素里id为a01的div替换里面的元素为a if(a==0)//判断倒计时为0时; { window.clearInterval(b);//清除倒计时;停止倒计时b d.removeAttribute("disabled");//找到d(对应id"a02") d.setAttribute("onclick","dj()");//找到d改变它的onclick属性为dj(); } } } function dj()//上面函数运行完成后"a02"会被赋予点击事件函数名为dj();点击执行本条函数 { if(e==null)//判断e是否为空,如果为空执行内容; { var e=window.open("index.html","_blank"); } } </script>