美文网首页
Javascript setInterval()和clearIn

Javascript setInterval()和clearIn

作者: 月巴月巴 | 来源:发表于2019-04-26 00:29 被阅读0次

    注意: setInterval()返回值必须作为clearInterval()的入参才能把定时器停了。

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    
    </head>
    <body>
        <span id="seconds"></span><span> Seconds Left</span>
        <br>
        <button id="restart">Restart</button>
    
    
        <script type="text/javascript">
            $(function(){
                configDomEventHandlers();
                runCountDownJob();
            });
    
            var total = 5;
            var countDownJobId = null;
    
            var configDomEventHandlers = function() {
                $("#restart").click(restart);
            };
    
            var restart = function() {
                total = 5;
                stopCountDown();
                runCountDownJob();
            };
    
            var runCountDownJob = function() {
                countDownJobId = setInterval(countDownJobDetail, 1000);
            };
    
            var countDownJobDetail = function() {
                if (total >= 0) {
                    countDown();
                } else {
                    stopCountDown();
                }
            };
    
            var countDown = function() {
                $("#seconds").text(total--);
            };
    
            var stopCountDown = function() {
                clearInterval(countDownJobId);
                countDownJobId = null;
            };
        </script>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:Javascript setInterval()和clearIn

          本文链接:https://www.haomeiwen.com/subject/ofrxnqtx.html