zoukankan      html  css  js  c++  java
  • 倒计时

    原生js倒计时

    <html>
    
    <head>
        <title>count_down</title>
        <script type="text/javascript">
        var countDown = {
            flag: true,
            hour: 0,
            minutes: 0,
            minutesNew: 0,
            seconds: 0,
            show: 0,
            current: 0,
            length: 0,
            showTagId: null,
            // callback: null, 
            countDownInner: function(vTimeLength) {
                if (!this.flag) {
                    return;
                }
                var that = this;
                this.current = vTimeLength;
                minutes = Math.floor(vTimeLength / 60);
                seconds = Math.floor(vTimeLength % 60);
                if (minutes >= 60) {
                    hour = Math.floor(minutes / 60);
                    minutesNew = Math.floor(minutes % 60);
                    if (hour < 10) {
                        hour = "0" + hour;
                    }
                    if (minutesNew < 10) {
                        minutesNew = "0" + minutesNew;
                    }
                    if (seconds < 10) {
                        seconds = "0" + seconds;
                    }
                    show = hour + ":" + minutesNew + ":" + seconds;
    
                } else {
                    if (minutes < 10) {
                        minutes = "0" + minutes;
                    }
                    if (seconds < 10) {
                        seconds = "0" + seconds;
                    }
                    show = minutes + ":" + seconds;
                }
                document.getElementById(this.showTagId).innerHTML = show;
                vTimeLength = vTimeLength - 1;
                if (vTimeLength > 0) {
                    setTimeout(function() { that.countDownInner(vTimeLength); }, 1000);
                } else {
                    setTimeout(function() { that.callback(); }, 1000);
                }
            },
            run: function(vTimeLength, showTagId, callback) {
                if (!this.flag) {
                    this.flag = true;
                    this.countDownInner(this.current);
                } else if (showTagId) {
                    this.length = vTimeLength;
                    this.showTagId = showTagId;
                    this.callback = callback;
                    this.countDownInner(vTimeLength);
                }
            },
            stop: function() {
                this.flag = false;
            },
            restart: function() {
                this.flag = true;
                this.countDownInner(this.length);
            }
        };
    
        function countDownStart() {
            countDown.run();
        }
    
        function countDownStop() {
            countDown.stop();
        }
        </script>
    </head>
    
    <body>
        <div id="div_countDown"></div>
        <script type="text/javascript">
        //参数 1.倒计时的秒数   2.控件的id    3.时间到了执行的方法
        countDown.run(100, 'div_countDown', function() { alert('12') });
        </script>
        <span> 
          <button onclick="countDownStart();">start</button> 
          <button onclick="countDownStop();">stop</button> 
        </span>
    </body>
    
    </html>
  • 相关阅读:
    2017-2018-2 20165207 实验四《Android开发基础》实验报告
    2017-2018-2 20165207 实验三《敏捷开发与XP实践》实验报告
    20165207 第九周学习总结
    20165328 实验四《Andriid应用开发》实验报告
    20165328 第十二周课上补做
    20165328 课下作业补做
    20165328 第九周学习总结
    2017-2018-2 20165328 实验三《敏捷开发与XP实践》实验报告
    20165328 结对编程第二周整体总结
    20165328课上补做
  • 原文地址:https://www.cnblogs.com/chenmiaosong/p/7735402.html
Copyright © 2011-2022 走看看