2013-08-15 5 views
5

Вот fiddle.Вызов метода Javascript Object с помощью SetInterval()

Я пытаюсь создать объект обратного отсчета, который использует moment.js (плагин, который я предпочитаю по сравнению с использованием Даты())

var Countdown = function(endDate) { 
    this.endMoment = moment(endDate); 

    this.updateCountdown = function() { 
     var currentMoment, thisDiff; 

     currentMoment = moment(); 
     thisDiff = (this.endMoment).diff(currentMoment, "seconds"); 

     if (thisDiff > 0) 
      console.log(thisDiff); 
     else { 
      clearInterval(this.interval); 
      console.log("over"); 
     } 
    } 

    this.interval = setInterval(this.updateCountdown(), 1000); 
} 

Я затем создать экземпляр обратного отсчета времени, как так:

var countdown = new Countdown("January 1, 2014 00:00:00"); 

Однако функция работает только один раз. Есть идеи? Должен ли я использовать setTimeout() вместо этого?

+1

попробуйте 'this.updateCountdown' в своем запросе' setInte rval'. – fbynite

+0

, который, похоже, не ссылается на объект (выдает ошибку «Невозможно вызвать метод« diff »неопределенного): http://jsfiddle.net/zCFr5/2/ – dougmacklin

+0

Вам нужно сделать что-то вроде этого http: // jsfiddle .net/zCFr5/3/ – fbynite

ответ

3

Вы можете хранить this контекст в качестве локальной переменной, как в следующем:

var Countdown = function(endDate) { 
    var self = this; 
    this.endMoment = moment(endDate); 

    this.updateCountdown = function() { 
     var currentMoment, thisDiff; 

     currentMoment = moment(); 
     thisDiff = (self.endMoment).diff(currentMoment, "seconds"); 

     if (thisDiff > 0) 
      console.log(thisDiff); 
     else { 
      clearInterval(self.interval); 
      console.log("over"); 
     } 
    } 

    this.interval = setInterval(this.updateCountdown, 1000); 
} 

Или вы можете просто использовать переменные непосредственно, такие как:

var Countdown = function(endDate) { 
    var endMoment = moment(endDate); 

    this.updateCountdown = function() { 
     var currentMoment, thisDiff; 

     currentMoment = moment(); 
     thisDiff = (endMoment).diff(currentMoment, "seconds"); 

     if (thisDiff > 0) 
      console.log(thisDiff); 
     else { 
      clearInterval(interval); 
      console.log("over"); 
     } 
    } 

    var interval = setInterval(this.updateCountdown, 1000); 
} 

Я предпочитаю второй подход - fiddle

9

Вы должны передать ссылку на функционирование, а не на результат его выполнения. Кроме того, вам понадобится дополнительная «магия», чтобы вызвать метод таким образом.

var me = this; 
this.interval = setInterval(function() { 
    me.updateCountdown(); 
}, 1000); 
+0

Вместо сохранения ссылки на 'this' вы можете использовать' Function.bind'. http://stackoverflow.com/a/6065221/139010 –

+0

Да, но это не работает в старых браузерах. И никаких оснований для этого не подразумевалось. – kirilloid

+0

Кажется, что все еще не работает, вот обновленная скрипка: http://jsfiddle.net/zCFr5/1/ – dougmacklin

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