setInterval внутри объекта в JavaScript

я пытаюсь сделать бар таймера с помощью этого кода:setInterval внутри объекта в JavaScript

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

но мне кажется, что setInterv аль() не работает

источник

2016-11-23 k961

@ aw04 оберткой что? – k961

«Это сложная вещь в javascript. Возможно, вы захотите немного прочитать [this] (http://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work) –

'setInterval'. Подумайте об этом как о функции ... которую вы сразу вызываете при создании объекта, а не о функции, которая запускает таймер при его вызове. – Damon

Похоже, вы хотите установить startTimer на ссылку функции, но вместо этого вы вызываете setInterval и устанавливаете startTimer на все, что он возвращает.

Вы можете попробовать

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

источник

2016-11-23 18:59:31

Если вы хотите, чтобы код в setTimer собственности для выполнения, вы должны обернуть его в функции:

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

И тогда вы бы назвали его:

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

В скобках в конце инструкции указано, что вы хотите выполнить функцию, сохраненную в свойстве.

Как сейчас, у вас есть простое свойство, которое хранит целое число, возвращаемое из вызова setInterval.

источник

2016-11-23 18:58:53

setInterval внутри объекта в JavaScript

ответ

Смежные вопросы