开发者社区> 问答> 正文

clearInterval 函数的问题

var loadBar={
            count:0,
            start:function(obj){
                var t=this;
                return setInterval(function(){
                    ++t.count;
                    obj.style.width=t.count+'px';
                    if(t.count >= 500){
                        clearInterval(t.start()); //这个清除函数 不对 不知道怎么改了
                        document.getElementById("msg").innerHTML="加载完成";
                    }
                },10);
            }
        }

展开
收起
a123456678 2016-07-15 14:52:55 2178 0
1 条回答
写回答
取消 提交回答
  • <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        </head>
        <body>
     
            <div id="a" style="width:200px;border:dashed black 1px;">
                &nbsp;
            </div>
            <div id="msg1">
                here1
            </div>
     
            <div id="b" style="width:200px;border:dashed black 1px;">
                &nbsp;
            </div>
            <div id="msg2">
                here2
            </div>
     
            <script>
                function LoadBar(obj, msg, time, max) {
     
                    this.count = 0;
     
                    this.obj = obj;
                    this.msg = msg;
     
                    this.time = time;
     
                    this.max = max;
     
                    function PolledRequestSender(requesterObj, time) {
                        this.ref = null;
                        this.time = time;
                        this.requesterObj = requesterObj;
                    }
     
     
                    PolledRequestSender.prototype = {
                        getIntervalFn : function(requesterObj) {
                            return function() {
                                requesterObj.apply(requesterObj);
                            };
                        },
                        start : function() {
                            this.ref = setInterval(this.getIntervalFn(this.requesterObj), this.time);
                        },
                        stop : function() {
                            clearInterval(this.ref);
                        }
                    };
     
                    this.mypoller = new PolledRequestSender(this, this.time);
                }
     
     
                LoadBar.prototype = {
                    apply : function() {
                        this.count++;
     
                        this.obj.style.width = this.count + 'px';
     
                        if(this.count >= this.max) {
                            this.mypoller.stop();
                            this.msg.innerHTML = "加载完成";
                        }
                    },
                    start : function() {
                        this.mypoller.start();
                    }
                };
                var loadBar = new LoadBar(document.getElementById("a"), document.getElementById("msg1"), 10, 500);
                loadBar.start();
     
                var loadBar2 = new LoadBar(document.getElementById("b"), document.getElementById("msg2"), 100, 100);
                loadBar2.start();
            </script>
        </body>
    2019-07-17 19:56:59
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载