计时器的开始与暂停

<script>
    //1.获取游戏的总时间60秒
    //2.游戏开始的时间
    //3.游戏进行时
    //4.游戏进行时-游戏开始时间 = 玩家游戏时长
    //5.游戏总时间-玩家游戏时长 = 游戏倒计时



    var game_time;//游戏总时长
    var game_start;//游戏开始时间
    var djs_span;//显示倒计时
    var id;//计时器id
    var game_djs;//游戏倒计时
    var isZT = false;//判断是否为暂停,false表示未点击暂停
    var zt_time;//暂停时的倒计时值
    var jx_id;//继续游戏的倒计时id
    var startBtn;//游戏开始按钮


    window.onload = function(){
        djs_span = document.getElementById("djs");

        var zt = document.getElementById("zt");

        startBtn = document.getElementById("btn");


        startBtn.onclick = function(){

            clearTimeout(jx_id);

            if(isZT){
                var reset = confirm("您的游戏正在进行中,确定要重新开始吗?");
                if(reset){
                    zt.textContent = "暂停游戏";
                    isZT = false;
                }else{
                    return;
                }
            }

            //获取游戏总时长
            game_time = document.getElementById("time").value*60;
            //记录游戏开始时间
            game_start = new Date();
            //禁用开始按钮
            startBtn.disabled = true;
            djs();
        }


        //停止游戏
        document.getElementById("stop").onclick = function(){
            game_stop();
            //还原开始按钮
            startBtn.disabled = false;

        }

        zt.onclick = function(){
            game_zt();
            if(isZT){
                //点击继续按钮
                zt.textContent = "暂停游戏";
                isZT = false;
                //禁用开始按钮
                startBtn.disabled = true;
                //记录继续游戏开始时间
                game_start = new Date();
                game_jx();
            }else{
                //点击暂停按钮
                zt.textContent = "继续游戏";
                isZT = true;
                //还原开始按钮
                startBtn.disabled = false;
                //记录暂停时间
                zt_time = game_djs;
                game_zt();
            }
        }   
    }

    //倒计时方法
    function djs(){
        //获取游戏进行时
        var playing = new Date();

        game_djs = game_time-parseInt((playing - game_start)/1000);

        djs_span.innerHTML = game_djs;

        id = setTimeout("djs()",1000);

        //游戏结束
        if(game_djs<1){
            clearTimeout(id);
            alert("游戏结束");
        }
    }

    //暂停游戏
    function game_zt(){
        clearTimeout(id);
        clearTimeout(jx_id);
    }

    //继续游戏
    function game_jx(){
        //获取游戏进行时
        var playing = new Date();

        game_djs = zt_time - parseInt((playing-game_start)/1000);

        djs_span.innerHTML = game_djs;

        jx_id = setTimeout("game_jx()",1000);

        //游戏结束
        if(game_djs<1){
            clearTimeout(jx_id);
            alert("游戏结束");
        }
    }

    //游戏结束
    function game_stop(){
        clearTimeout(id);
        clearTimeout(jx_id);
        game_djs = 0;
        djs_span.innerHTML = game_djs;
    }
</script>


<body>
    游戏时长:<input id="time" type="text" size="3px"value="1"/>分钟<br />
    游戏倒计时:<span id="djs"></span>秒<br />
    <button id="btn">开始游戏</button>
    <button id="zt">暂停游戏</button>
    <button id="stop">停止游戏</button>
</body>

  • 0
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值