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>
  • 相关阅读:
    LeetCode Binary Tree Inorder Traversal
    LeetCode Populating Next Right Pointers in Each Node
    LeetCode Construct Binary Tree from Inorder and Postorder Traversal
    LeetCode Reverse Linked List II
    LeetCode Populating Next Right Pointers in Each Node II
    LeetCode Pascal's Triangle
    Palindrome Construct Binary Tree from Preorder and Inorder Traversal
    Pascal's Triangle II
    LeetCode Word Ladder
    LeetCode Binary Tree Zigzag Level Order Traversal
  • 原文地址:https://www.cnblogs.com/chenmiaosong/p/7735402.html
Copyright © 2011-2022 走看看