js使用settimeout實(shí)現(xiàn)定時(shí)炸彈的方法

字號(hào):


    今天看 css探索之旅 的博客文章,有個(gè)用settimeout寫定時(shí)炸彈的效果,自己也就照貓畫貓來寫一個(gè)。
    <!doctype html public -//w3c//dtd xhtml 1.0 transitional//en
    >
    <html xmlns=>
    <head>
    <meta http-equiv=content-type content=text/html; charset=gb2312/>
    <title>無標(biāo)題文檔</title>
    <style>
    div{
    width:200px;
    height:50px;
    margin:30px auto 0;
    background:#ccc;
    text-align:center;
    font:14px/50px arial;
    cursor:pointer
    }
    </style>
    <script type=text/javascript src=js/jquery_1.4.2.js></script>
    </head>
    <body>
    <div id=zha>開始定時(shí)</div>
    <div id=chai style=display:none>拆除炸彈</div>
    <script>
    $(#zha).bind(click,function(){
    zha();
    })
    $(#chai).bind(click,function(){
    chai();
    })
    var time = 5;
    var timer = 0;
    function zha(){
    var text = 倒計(jì)時(shí);
    text += time--;
    $(#zha).text(text);
    if(time >=0){
    timer = settimeout(zha,1000);
    $(#zha).css(color,black);
    $(#chai).show();
    }else{
    $(#zha).text(爆炸);
    $(#zha).css(color,red);
    time = 5;
    $(#chai).fadeout();
    }
    }
    function chai(){
    cleartimeout(timer);
    $(#zha).text(炸彈拆除成功,點(diǎn)擊繼續(xù));
    }
    </script>
    </body>
    </html>