Eine Klasse Countdown in Javascript

Montag, 13. Oktober, 2008

In der Nachkriegszeit mit 3D-CountDown FIVe3D (Siehe wie ich es gemacht habe: Schreiben Sie ein Countdown in Flash), war eine Klasse Vorschlag für die Schaffung eines Objekts CountDown in Actionscript, hier ist eine ähnliche Version in Javascript:

JavaScript:
  1. / **
  2. * CountDown Klasse
  3. *
  4. * @ Autor Giovambattista Fazioli
  5. * @ @ E-Mail g.fazioli undolog.com
  6. * @ Web http://www.undolog.com
  7. *
  8. * @ Param dd (string) "Tag Monat, Jahr"
  9. *
  10. * /
  11. dd ) { Countdown-Funktion (dd) (
  12. / / Init Ziel-Zeit
  13. Date ( dd ) ; var target = new Date (dd);
  14. = target. getTime ( ) ; dieser. targetTime = Ziel. getTime ();
  15. / **
  16. * Refresh-Countdown
  17. * /
  18. = function ( ) { dieser. refresh = function () (
  19. Date ( ) ; var heute = new Date ();
  20. ( ) ; var = CurrentTime heute. getTime ();
  21. / / Time links
  22. this . targetTime - currentTime ) ; dieser. _leftMilliseconds = (this. targetTime - CurrentTime);
  23. ( this ._leftMilliseconds / 1000 ) ; dieser. _leftSeconds = Math. Stock (this. _leftMilliseconds / 1000);
  24. ( this ._leftSeconds / 60 ) ; dieser. _leftMinutes = Math. Stock (this. _leftSeconds / 60);
  25. ( this ._leftMinutes / 60 ) ; dieser. _leftHours = Math. Stock (this. _leftMinutes / 60);
  26. / / Nein-Modul
  27. = Math. floor ( this ._leftHours / 24 ) ; dieser. leftDays Math =. Stock (this. _leftHours / 24);
  28. / / Für Print -
  29. = this ._leftMilliseconds % 1000 ; dieser. leftMilliseconds = dieser. _leftMilliseconds% 1000;
  30. = this ._leftSeconds % 60 ; dieser. leftSeconds = dieser. _leftSeconds% 60;
  31. = this ._leftMinutes % 60 ; dieser. leftMinutes = dieser. _leftMinutes% 60;
  32. = this ._leftHours % 24 ; dieser. leftHours = dieser. _leftHours% 24;
  33. )
  34. ( ) ; dieser. refresh ();
  35. )

Beispiel

JavaScript:
  1. countDown ( '1 1, 2009' ) ; var so = new Countdown ('1 1, 2009 ');
  2. / / Zeigen Sie, wie viele Tage, Stunden, Minuten, Sekunden und Millisekunden in der ersten Januar 2009
  3. cd. leftDays + "," + cd. leftHours + "," + cd. leftMinutes + "," + cd. leftSeconds + "," + cd. leftMilliseconds ) ; Dokument. write (dh leftDays + "," + CD. leftHours + "," + CD. leftMinutes + "," + CD. leftSeconds + "," + CD. leftMilliseconds);

Verwandte Post

4 Kommentare an: "Eine Klasse Countdown in Javascript"

  1. getAvatar 1,0 Dienstag, 14. Oktober 2008 bei 16:03
    Riccardo Worthy sagte:

    Giovambattista hallo,
    Ich finde das sehr interessante Lösung Javascript, denn es ist einfach und leicht. Von Liebe Scripting, ich nahm einige Änderungen an Ihrem Code, dass Sie die folgenden Schritte aus:

      Countdown-Funktion (dd) ( 
          / / Init Ziel-Zeit 
          var target = new Date (dd); 
          this.targetTime = target.getTime (); 
    
          / ** 
           * Refresh-Countdown 
           * / 
          this.refresh = function () ( 
              var heute = new Date (); 
              var CurrentTime = today.getTime (); 
              / / Time links 
              this.leftMilliseconds = this.targetTime - CurrentTime; 
              this.leftSeconds = Math.floor (this.leftMilliseconds / 1000); 
              this.leftMinutes = Math.floor (this.leftSeconds / 60); 
              this.leftHours = Math.floor (this.leftMinutes / 60); 
              this.leftDays = Math.floor (this.leftHours / 24); 
              this.render (); 
          ); 
    
          this.render = function () ( 
              this.leftMilliseconds this.ms = = this.leftMilliseconds% 1000; 
              this.leftSeconds = this.leftSeconds% this.s = 60; 
              this.leftMinutes = this.mate this.leftMinutes% = 60; 
              this.leftHours = this.leftHours% this.h = 24; 
              this.d = this.leftDays; 
          ); 
    
          this.output = function (_format) ( 
              var format = _format.split ('') | | 'dhms ms', output =''; 
              / / Alert (fn); kommentiert rückgängig zu machen = = : D
              for (var t im Format) ( 
                  if (diese [Format [t]]) + = Ausgang dieser [Format [t]] + ((t! = format.length-1)?',':''); 
              ) 
              document.write (output); 
          ); 
    
          this.refresh (); 
      ) 
    

    Wesentlichen weitere wesentliche Leistung ist die Methode, mit der Sie sich den Druck der Countdown mit dem gewünschten Format durch den Nutzer (in einer Art sehr ähnlich wie in PHP).
    Zum Beispiel, wenn Sie möchten, das Datum, Stunden, Minuten, Sekunden und Millisekunden fehlen durch unsere Countdown, wir könnten gehen Sie wie folgt vor, jeder Zeit, ohne daran erinnern, die internen Eigenschaften unserer Klasse:

      var so = new Countdown ('1 1, 2009 '); 
      cd.output ( 'dhms ms'); 
    

    Die Methode "machen" ist schließlich "normalisieren" das Format der Zahlen.

    Ein weiteres interessantes Außerdem wäre es, ein "Start", die ruft die Methode Ausgabe in regelmäßigen Abständen, so dass scheint ein echter Countdown (Countdown-Zähler wird gestoppt durch ihre Methode "Stop").

    Riccardo Worthy

    Antwort Quote
  2. getAvatar 1,0 Dienstag, 14. Oktober 2008 bei 22:27
    Giovambattista Fazioli sagte:

    @ Richard Worthy wirklich eine schöne Variante, bravo! Besonders interessante Technik, um die Ausgabe-Format: genial und dünn! In der Methode output() würde eine return(output) um zurück zu gehen return(output) als ein document.write() ... aber es ist ein Detail. Ein Timer mit start() stop() wirklich umfassend. Herzlichen Glückwunsch und Dank für die interessanten Anregungen :)

    Antwort Quote
  3. getAvatar 1,0 Mittwoch, 15. Oktober 2008 bei 12:45
    Riccardo Worthy sagte:

    @ Giovambattista Fazioli:

    Die Ausgabe-Methode () würde eine Grenze, um zurück zu gehen (Output) und nicht als ein document.write ()

    Sicher, ich eingefügt document.write zur sofortigen Benachrichtigung des Tests, in der endgültigen Produktion einer return ist ein Muss ;)

    Herzlichen Glückwunsch und Dank für die interessanten Anregungen :)

    Als gar nichts, ich war froh, diesen Austausch von Meinungen :)

    Bis bald,
    Riccardo Worthy

    Antwort Quote
  4. getAvatar 1,0 Donnerstag, 20. November 2008 bei 22:31
    Giovambattista Fazioli sagte:

    Update: Microsoft Internet Explorer 7 wird das Datum im numerischen "3 5, 2008" geben Sie "3 5, 2008" Fehler. So löschen Sie einfach die "Monats" im Format 3 Buchstaben in Englisch: Jan, Feb, März, etc. ...

    Antwort Quote

Schreibe einen Kommentar

TAG XHTML <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <a <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Verwenden Sie <pre> zu umschließen Code