Question

我正在尝试使用此代码制作计时器栏：

var timer =  {
    elem: document.getElementById("myBar"),
    width:0,
    startTimer: setInterval(this.addWidth, 10),
    addWidth : function() {
        this.width += 0.01;
        this.elem.style.width = this.width + '%';
    },
    stopTimer: function() {
        clearInterval(this.startTimer);
        showModal();
    }
}

这是html

var newHtml =   '<div id="myProgress">' +
                '<div id="myBar">' +
                '<div id="label"></div>' +
                '</div>' +
                '</div>';

稍后，我会在将html添加到页面并使用

后将其添加到文档中

timer.startTimer

但似乎 setInterval（）无效

Answer 1

看起来您的意思是将startTimer设置为函数引用，而是您调用setInterval并将startTimer设置为它返回的任何内容。

你可以尝试

startTimer: function () {setInterval(this.addWidth, 10);},

Answer 2

如果要执行setTimer属性中的代码，则必须将其包装在函数中：

startTimer: function(){ setInterval(this.addWidth, 10) };

然后你用以下方式调用它：

timer.startTimer(); // Note the parenthesis?

语句末尾的括号表示您要执行存储在属性中的函数。

现在，你有一个简单的属性存储从setInterval调用返回的整数。

javascript中对象内的setInterval

2 个答案: