对象中的javascript间隔

Question

我写了一个片段,它应该开始计算从1到1000或预先定义的数字.

由于需要脚本多次,我认为将它作为一个对象编写并使用它多次是一个好主意.但我得到一个错误:

未捕获的ReferenceError:未定义root(匿名函数)

我错了什么？

     var time = function() {
        var root = this;
        var i=0;
        root.max = 1000;
        root.elm = false;
        root.runTime = function() {
            if(root.elm != false) {
                if (i < root.max) {
                    i++;
                    root.elm.text(i);
                } else {
                    clearInterval(root.interval);
                }
            }
            this.interval = setInterval('root.runtTime()', 5);
        };
    };

    if($(document).ready(function() {
        var countUp= new time();
        countUp.max = 1526;
        countUp.elm = $("#elm");
        countUp.runTime();
    });

Answer 1

这是因为以下行:

this.interval = setInterval('root.runtTime()', 5);

因为它是一个字符串,所以必须将其评估为全局对象.

更改为以下内容以确保相同的范围:

this.interval = setInterval(root.runtTime, 5);

还有一个拼写错误(runtTime应该是runTime),所以改为以下内容:

this.interval = setInterval(root.runTime, 5);

最后你正在使用setInterval哪个会root.runTime每隔5ms 重复一次.setTimeout如果您希望以递归方式调用此方法,请更改为:

this.interval = setTimeout(root.runTime, 5);

或者,在runTime函数外部设置间隔:

   root.runTime = function() {
        if(root.elm != false) {
            if (i < root.max) {
                i++;
                root.elm.text(i);
            } else {
                clearInterval(root.interval);
            }
        }
    };
    this.interval = setInterval(root.runTime, 5); 

你也不需要if声明document.ready.这是一个在DOM加载时触发的回调函数,因此不需要if语句.

$(document).ready(function() {
    var countUp= new time();
    countUp.max = 1526;
    countUp.elm = $("#elm");
    countUp.runTime();
});