码迷,mamicode.com
首页 > 其他好文 > 详细

倒计时确定

时间:2017-10-24 11:24:38      阅读:140      评论:0      收藏:0      [点我收藏+]

标签:top   document   title   var   head   inner   put   att   click   

<!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
            {
                width: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>

 

倒计时确定

标签:top   document   title   var   head   inner   put   att   click   

原文地址:http://www.cnblogs.com/bkyljk/p/7721850.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!