2013-08-15 21 views
5

Poniżej przedstawiono fiddle.Wywołanie metody obiektowej Javascript za pomocą funkcji SetInterval()

Próbuję utworzyć obiekt, który wykorzystuje moment.js odliczania (plugin, że wolę się za pomocą Data())

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); 
} 

I następnie utworzyć instancję odliczania tak:

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

Jednak funkcja działa tylko raz. Jakieś pomysły? Czy zamiast tego powinienem używać funkcji setTimeout()?

+1

spróbuj 'this.updateCountdown' w swoim wywołaniu' setInte rval'. – fbynite

+0

które nie wydaje się odwoływać do obiektu (zgłasza błąd "Nie można wywołać metody" diff "o niezdefiniowanym kodzie): http://jsfiddle.net/zCFr5/2/ – dougmacklin

+0

Musisz zrobić coś takiego: http: // jsfiddle .net/zCFr5/3/ – fbynite

Odpowiedz

3

Można też zapisać kontekst this jako zmiennej lokalnej tak:

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); 
} 

Albo można po prostu użyć zmiennych bezpośrednio takie jak:

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); 
} 

Wolę drugie podejście - fiddle

9

Powinieneś przekazać referencję do funkcji, a nie wynik jego wykonania. Potrzebna jest również dodatkowa "magia", aby wywołać metodę w ten sposób.

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

Zamiast zapisywać odniesienie do 'this', możesz użyć' Function.bind'. http://stackoverflow.com/a/6065221/139010 –

+0

Tak, ale nie działa w starszych przeglądarkach. I żadne ramy tego nie sugerowały. – kirilloid

+0

Wygląda na to, że nie działa, tutaj jest zaktualizowane skrzypce: http://jsfiddle.net/zCFr5/1/ – dougmacklin

Powiązane problemy