[Erledigt] Countdown modifizieren - Javascript

Benshy · 15.07.2010, 18:08

Hi,

freunde mich gerade ein wenig mit Javascript an, bin aber derzeit noch eher ein vollnoob

das nur vorneweg.

Am besten lerne ich wenn man erklärt was das script an welcher stelle genau macht.

Aktuell habe ich folgendes Problem:

Ich verwende folgendes Script für einen Countdown zu einem bestimmten in der Zukunft liegenden Timestamp, der per PHP in das Javascript übernommen wird.

Code:

echo '<script type="text/javascript">
                                <!--
                                ende='.$endzeitprufen.';
                                iHTML=false;
                                function printCounter()
				{
				out=\'<form name="fCD"><input type="text"size="7"name="CD"></form>\';
				if(document.getElementsByTagName&&document.getElementsByTagName(\'title\')[0].innerHTML)
					{iHTML=true;
					out=\'<span id="CD">f&nbsp</span>\';
					}
				return out;
				}
				function countDown()
				{
				out=\'0:00\';
				now=new Date();now=parseInt(now.getTime()/1000);
				if(now<ende)
					{
					out=parseInt((ende-now)/60)+\':\';
					sek=(ende-now)%60;
					if(sek<10){out+=\'0\';}
					out+=sek;
					}
				if(iHTML){document.getElementById(\'CD\').innerHTML=out;}
				else{document.fCD.CD.value=out;}
				if(now<ende){setTimeout("countDown()",1000);}
				}
				window.onload=countDown;
				//-->
				</script>';


usw..........

Mir gehts hierbei um folgenden Bereich genau:

Code:

				out=\'0:00\';
				now=new Date();now=parseInt(now.getTime()/1000);
				if(now<ende)
					{
					out=parseInt((ende-now)/60)+\':\';
					sek=(ende-now)%60;
					if(sek<10){out+=\'0\';}
					out+=sek;
					}

Soweit ich jetzt verstehe ist dieser dafür verantwortlich, den Zähler in Minuten und Sekunden zu unterteilen.

Jetzt zu meinem eigentlichen Problem:
Ich möchte gerne noch Stunden und Tage hinzufügen.
Die wiederrum sollen aber nur angezeigt werden, sofern auch Stunden oder Tage benötigt werden ( heißt: If Stunden = 0, dann Stundenbereich ausschalten ).

ich denke mit 2 if anweisungen müsste das möglich sein.
Wie aber schaffe ich es Tage und Stunden herzubekommen?

Ein Ansatz welchen Bereich ich genau verändern muss wäre ganz nett, evtl. auch mit einem Tip wie ich es ändern müsste.

Wäre echt super lieb wenn mir jemand von euch versierten da weiterhelfen könnte.

ChrisB · 15.07.2010, 18:24

Zitat:

Zitat von Benshy

Wie aber schaffe ich es Tage und Stunden herzubekommen?

Das ist erst mal kein JavaScript-, sondern ein reines Mathematik-Problem.

Und dazu überlege dir bitte erst mal selbst einen Ansatz.

(Oder, wenn dir dazu absolut gar nichts einfällt, melde dich hier an: www.schuelerhilfe.de)

Benshy · 15.07.2010, 19:49

Oh, tut mir leid chris. Ich wusste nicht das erfahrene Javascripter nicht wissen das 1 Stunde 60 Minuten und 1 Tag 24 Stunden hat.

Dann hier mal in ausführlicher Weise was ich gerne hätte.

Also zwischen oben erwähnten Klammern soll folgendes

Code:

If(timestamp >= 86400)
  {
  Tage = Timestamp / 86400
  Ausgabe der Tage
  Timestamp2 = timestamp - (tage * 86400)
  }
Else
  {
  Timestamp2 = timestamp
  }

If(timestamp2 >= 3600)
  {
  Stunden = Timestamp2 / 3600
  Ausgabe der Stunden
  Timestamp3 = timestamp2 - (stunden * 3600)
  }
Else
  {
  Timestamp3 = timestamp2
  }

If(timestamp3 >= 60)
  {
  Minuten = timestamp3 / 60
  Ausgabe der Minuten
  Timestamp4 = timestamp3 - (minuten * 60)
  }
Else
  {
  Timestamp4 = timestamp3
  }

Sekunden = timestamp4
Ausgabe Sekunden

Zuvor wird aktueller timestamp von zieltimestamp abgezogen und das ergebniss in dem code oben zum rechnen verwendet.

So: wie drücke ich das jetzt in dem javateil im ersten post aus?
Ich hoffe die mathematik reicht chris

ChrisB · 15.07.2010, 19:57

Zitat:

Zitat von Benshy

Ich wusste nicht das erfahrene Javascripter nicht wissen das 1 Stunde 60 Minuten und 1 Tag 24 Stunden hat.

Dieses Wissen hat nichts mit JavaScript zu tun, und genau darauf habe ich dich hingewiesen.

Zitat:

So: wie drücke ich das jetzt in dem javateil im ersten post aus?
Ich hoffe die mathematik reicht chris

Wenn du mir mit solchen Pseudo-Sarkasmus kommst, der absolut unangebracht ist, dann erwarte bitte nicht von mir, dass ich mir noch größere Mühe geben werde, dir bei deinem Problem weiter zu helfen.

Zitat:

Also zwischen oben erwähnten Klammern soll folgendes [...]

Das soll jetzt was sein, Pseudocode?
Na gut, dann brauchst du diesen ja nur noch nach JavaScript übersetzen (sofern die Logik korrekt ist).

Wenn dir dazu das Grundlagenwissen über die Syntax und/oder den Umgang mit JavaScript fehlt - dann arbeite bitte ein Grundlagen-Tutorial durch.

Benshy · 15.07.2010, 20:14

Ich habe nach hilfe gebeten und finde es von dir eine Frechheit mich als jemanden zu bezeichnen der keine schulbildung hat.

Ich gehe davon aus, das mir ein ansatz gegeben wird, evtl. Auch ein tutorial, das dieses thema für anfänger beschreibt.

Ich habe in meinem ersten post mitgeteilt das ich in javascript ein blutiger noob bin, als hinweis für euch versierte personen, damit ihr wisst das es hier um grundwissen mitgeht.

Und dann kommt so eine antwort von dir. Eine antwort die mich und ander und keiner einzigen richtung weiterbringt.

Und das in einem hilfeforum.
Das ich hier grundsätzlich als Anfänger immer 1000 mal überlegen muss was ich hier frage ist mir schon klar, liegt aber wohl auch grundsätzlich an der einstellung eines versierten. Die topprogrammierer kommen mir einfach nur hochnäßig vor und möchten anfängern gar nicht helfen.
Es gibt ausnahmen, vielleicht bist du ja eine.

Und sry, kränken wollte ich dich nicht.

ChrisB · 15.07.2010, 20:36

Zitat:

Zitat von Benshy

Ich habe nach hilfe gebeten und finde es von dir eine Frechheit mich als jemanden zu bezeichnen der keine schulbildung hat.

Wenn du so simpel fragst,

Zitat:

Wie aber schaffe ich es Tage und Stunden herzubekommen?

- dann darf ich doch wohl erst mal davon ausgehen, dass dir nicht klar ist, wie der rein mathematische Teil dieser Aufgabenstellung aussieht.

Wenn du mir daraufhin mit

Zitat:

Ich wusste nicht das erfahrene Javascripter nicht wissen das 1 Stunde 60 Minuten und 1 Tag 24 Stunden hat.

kommst, dann wusstest du es also wohl doch - aber dann ist mir unverständlich, wieso du obige Frage in dieser simpel-naiven Form stellst.

Zitat:

Ich habe in meinem ersten post mitgeteilt das ich in javascript ein blutiger noob bin, als hinweis für euch versierte personen, damit ihr wisst das es hier um grundwissen mitgeht.

Und deshalb sage ich dir - wenn dir das Grundlagenwissen im Bereich JavaScript fehlt, dann arbeite bitte erst mal ein entsprechendes Tutorial o.ä. durch.

Zitat:

Und dann kommt so eine antwort von dir. Eine antwort die mich und ander und keiner einzigen richtung weiterbringt.

Und das in einem hilfeforum.

Ja, da sind wir wieder bei dem Punkt, wie „Hilfe“ definiert wird, und welche Ansprüche Fragesteller stellen.

Zitat:

Das ich hier grundsätzlich als Anfänger immer 1000 mal überlegen muss was ich hier frage ist mir schon klar, liegt aber wohl auch grundsätzlich an der einstellung eines versierten. Die topprogrammierer kommen mir einfach nur hochnäßig vor und möchten anfängern gar nicht helfen.

Als (bescheidenheitshalber: halbwegs) „Versierter“ weiß ich noch genau, wie ich gelernt habe, und woher ich das weiß, was ich weiß:
Ich habe mich informiert, habe Dokumentationen gelesen, ausprobiert, dazu gelernt.

Und weil ich weiß, dass man so lernen kann, gehe ich erst mal davon aus, dass das dir auch möglich sein sollte. (Wenn ich davon, ohne dich zu kennen, nicht ausginge, wäre das die eigentliche Frechheit.)

Zitat:

Und sry, kränken wollte ich dich nicht.

Ich dich auch nicht; der Schülerhilfe-Hinweis ist meine sarkastische Art, auf solche Fragestellungen zu reagieren, deren Intention ich absolut nicht nachvollziehen kann.

Ich kann nicht verstehen, warum so viele Anfänger in Foren kommen, und dort ein Anspruchsdenken an den Tag legen, also ob sie irgendein Anrecht auf Privat-Lehrstunden hätten. (So kommen solche Fragestellungen zumindest bei mir meist an.)

Was du für diese Aufgabe brauchst, sind zunächst nicht mal viel mehr als die Grundlagen des Umgangs mit JavaScript.
Um den mathematischen Teil der Aufgabenstellung umzusetzen, braucht es nicht viel mehr als ein bisschen Wissen über die mathematischen Operatoren und Funktionen, die die Sprache bereit stellt, sowie den Umgang mit Kontrollstrukturen wie bspw. if/else.
Wie man das Ergebnis nachher in ein HTML-Dokument einbaut/ausgibt, ist erst mal nebensächlich - zum Testen tun es auch Kontrollausgaben per alert().

Und das kann man an hand von Dokumentationen/Tutorials m.E. durchaus erst mal selber lernen - und wenn nicht gleich komplett lernen, dann zumindest doch erst mal versuchen. Wenn du dir logisch überlegt hast, was zu tun ist, und wie man das in JavaScript-Code umsetzt - und du dann dabei auf Probleme stößt, dann können wir die hier gerne diskutieren.

Mein Grundlagenwissen über JavaScript habe ich aus SELFHTML; das stellt allerdings eher nur eine Dokumentation/Referenz bereit, ist eher kein Tutorial.
Mir reicht sowas idR. zum anfänglichen Erlernen neuer Techniken - aber ich gebe gern zu, dass solch ein Vorgehen nicht jedermanns Sache sein mag.
Wenn du lieber an hand eines Tutorials lernen willst - dann such dir bitte eins. Mit Google & Co. zumindest soweit umgehen zu können, dass du was das angeht selber etwas für dich hilfreiches findest, setze ich allerdings mindestens voraus, wenn jemand das Internet selber mitgestalten will in einer Weise, die über das blosse liefern von Content hinaus und in die Programmierung hinein geht.

Benshy · 15.07.2010, 23:14

Ok, dann hab ich mich mal mit SELFHTML ein wenig befasst und wollte jetzt mal kurz von dir gegenchecken lassen ob das bisher soweit ok ist, die Ausgabe scheint auch korrekt zu funktionieren.

Code:

<html>
<script type="text/javascript">
<!--
var zeitinsek = 15000;


function vorberechnung ()
{

if (zeitinsek >= 86400)
   {
   var tage = Math.floor(zeitinsek / 86400);
   if (tage < 10)
      {
      var tage = "0"+tage;
      }
   var zeitinsek2 = zeitinsek - (tage * 86400);
   }
else
   {
   var tage = "00";
   var zeitinsek2 = zeitinsek;
   }

if (zeitinsek2 >= 3600)
   {
   var stunden = Math.floor(zeitinsek2 / 3600);
   var zeitinsek3 = zeitinsek2 - (stunden * 3600);
   if (stunden < 10)
      {
      var stunden = "0"+stunden;
      }
   }
else
   {
   var stunden = "00";
   var zeitinsek3 = zeitinsek;
   }

if (zeitinsek3 >= 60)
   {
   var minuten = Math.floor(zeitinsek3 / 60);
   var zeitinsek4 = zeitinsek3 - (minuten * 60);
   if (minuten < 10)
      {
      var minuten = "0"+minuten;
      }
   }
else
   {
   var minuten = "00";
   var zeitinsek4 = zeitinsek;
   }

var sekunden = zeitinsek4;
   if (sekunden < 10)
      {
      var sekunden = "0"+sekunden;
      }

}



function counter ()
{
document.write("" + tage + ":" + stunden + ":" + minuten + ":" + sekunden + "");  
}

//-->
</script>

mit folgender Zeile rufe ich dann das script auf:

Code:

<script type="text/javascript">
<!--
counter ();
//-->
</script>

Dann noch ne Frage:
Ich möchte diesen Bereich:

Code:

function counter ()
{
document.write("" + tage + ":" + stunden + ":" + minuten + ":" + sekunden + ""); 
}

noch so modifizieren, das er immer wieder wiederholt wird. Soweit ich das jetzt unter SELFHTML verstanden habe ginge das mit

Code:

window.setTimeout("counter()", 1000);

Er scheint auch irgendwas zu machen, aber wenn ich jetzt z. B.:

Code:

function counter ()
{

var sekunden = sekunden - 1;

document.write("" + tage + ":" + stunden + ":" + minuten + ":" + sekunden + ""); 
}

window.setTimeout("counter()", 1000);

das hier schreibe, dann ändert sich die Variable nicht.
Muss ich da noch auf was bestimmtes achten? oder wie kann ich eine funktion jede Sekunde neu durchlaufen lassen?

ChrisB · 15.07.2010, 23:23

document.write kannst du nur verwenden, während das Dokument geladen wird.
Benutzt du es anschließend noch, dann ersetzt es das aktuelle Dokument vollständig.

Du kannst aber bspw. innerHTML benutzen, um das ganze einfach als Inhalt in ein vorhandenes Element zu schreiben.
Bitte nicht die im dortigen Beispiel verwendete document.all-Syntax benutzen, das ist eine MS-Erfindung - stattdessen bspw. per getElementById auf das Element zugreifen.

Beispiel:

Code:

<div id="countdownAusgabe"></div>

document.getElementById("countdownAusgabe").innerHTML = ...;

Dazu muss das Element aber schon existieren, also entweder Script-Element erst nach diesem im Dokument unterbringen, oder die Funktion erst per onload aufrufen.

nikosch · 15.07.2010, 23:38

Vor allem - wieso sollte sich auch die Variable ändern? Das einzige was Du antriggerst ist die Ausgabe der ermittelten Werte.

Benshy · 16.07.2010, 01:59

So, habs gelöst:

Hier die Lösung in folgenden Thread:
http://www.php.de/scriptboerse/69775...-versehen.html ([Erledigt] Countdown mit Tage und Stunden versehen.)

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
timing Probleme bzw Zusammenspiel PHP Javascript	thica	PHP Tipps 2009	2	19.02.2010 19:06
Serveruhrzeit -> Countdown	phplars	PHP Tipps 2009	10	30.10.2009 17:09
Wie lade ich ein Javascript nach einer AJAX Abfrage neu?	da.eXecutoR	JavaScript, Ajax und mehr	3	21.09.2009 11:15
[Erledigt] Variable von Javascript mit 1x1px-Bild an PHP übergeben	beneblack	PHP Tipps 2009	18	03.05.2009 22:40
javascript countdown mit ajax einbinden	chrismh	JavaScript, Ajax und mehr	1	18.04.2009 11:29
JS: Einführung - Javascript im Schichtenmodell	nikosch	Tutorials	4	11.04.2009 17:06
1101: 10x JavaScript und kein Ende ist abzusehen…	Nikolaus 2.0	Adventskalender 2008	9	13.12.2008 20:11
Javascript: Suche ganz simples Countdown Script		HTML, Usability und Barrierefreiheit	2	22.09.2005 09:08
php in ein JavaScript Countdown einbinden!	Boennchen	PHP Tipps 2005	11	26.04.2005 13:41
[Erledigt] JavaScript + PHP (SQL) Countdown		HTML, Usability und Barrierefreiheit	5	23.12.2004 14:01
problem (countdown)		HTML, Usability und Barrierefreiheit	8	07.11.2004 23:08
Javascript		HTML, Usability und Barrierefreiheit	5	31.08.2004 18:30
Javascript countdown mal anders - erledigt	Ohrwurm83	HTML, Usability und Barrierefreiheit	4	02.07.2004 23:35
javascript countdown in while scheife	Ohrwurm83	PHP Tipps 2004	1	02.07.2004 16:50

15.07.2010, 18:08
Benshy Benutzer Registriert seit: 08.08.2009 Beiträge: 95 PHP-Kenntnisse: Anfänger	[Erledigt] Countdown modifizieren - Javascript Hi, freunde mich gerade ein wenig mit Javascript an, bin aber derzeit noch eher ein vollnoob das nur vorneweg. Am besten lerne ich wenn man erklärt was das script an welcher stelle genau macht. Aktuell habe ich folgendes Problem: Ich verwende folgendes Script für einen Countdown zu einem bestimmten in der Zukunft liegenden Timestamp, der per PHP in das Javascript übernommen wird. Code: echo '<script type="text/javascript"> <!-- ende='.$endzeitprufen.'; iHTML=false; function printCounter() { out=\'<form name="fCD"><input type="text"size="7"name="CD"></form>\'; if(document.getElementsByTagName&&document.getElementsByTagName(\'title\')[0].innerHTML) {iHTML=true; out=\'<span id="CD">f&nbsp</span>\'; } return out; } function countDown() { out=\'0:00\'; now=new Date();now=parseInt(now.getTime()/1000); if(now<ende) { out=parseInt((ende-now)/60)+\':\'; sek=(ende-now)%60; if(sek<10){out+=\'0\';} out+=sek; } if(iHTML){document.getElementById(\'CD\').innerHTML=out;} else{document.fCD.CD.value=out;} if(now<ende){setTimeout("countDown()",1000);} } window.onload=countDown; //--> </script>'; usw.......... Mir gehts hierbei um folgenden Bereich genau: Code: out=\'0:00\'; now=new Date();now=parseInt(now.getTime()/1000); if(now<ende) { out=parseInt((ende-now)/60)+\':\'; sek=(ende-now)%60; if(sek<10){out+=\'0\';} out+=sek; } Soweit ich jetzt verstehe ist dieser dafür verantwortlich, den Zähler in Minuten und Sekunden zu unterteilen. Jetzt zu meinem eigentlichen Problem: Ich möchte gerne noch Stunden und Tage hinzufügen. Die wiederrum sollen aber nur angezeigt werden, sofern auch Stunden oder Tage benötigt werden ( heißt: If Stunden = 0, dann Stundenbereich ausschalten ). ich denke mit 2 if anweisungen müsste das möglich sein. Wie aber schaffe ich es Tage und Stunden herzubekommen? Ein Ansatz welchen Bereich ich genau verändern muss wäre ganz nett, evtl. auch mit einem Tip wie ich es ändern müsste. Wäre echt super lieb wenn mir jemand von euch versierten da weiterhelfen könnte.


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

15.07.2010, 19:49
Benshy Benutzer Registriert seit: 08.08.2009 Beiträge: 95 PHP-Kenntnisse: Anfänger	Oh, tut mir leid chris. Ich wusste nicht das erfahrene Javascripter nicht wissen das 1 Stunde 60 Minuten und 1 Tag 24 Stunden hat. Dann hier mal in ausführlicher Weise was ich gerne hätte. Also zwischen oben erwähnten Klammern soll folgendes Code: If(timestamp >= 86400) { Tage = Timestamp / 86400 Ausgabe der Tage Timestamp2 = timestamp - (tage * 86400) } Else { Timestamp2 = timestamp } If(timestamp2 >= 3600) { Stunden = Timestamp2 / 3600 Ausgabe der Stunden Timestamp3 = timestamp2 - (stunden * 3600) } Else { Timestamp3 = timestamp2 } If(timestamp3 >= 60) { Minuten = timestamp3 / 60 Ausgabe der Minuten Timestamp4 = timestamp3 - (minuten * 60) } Else { Timestamp4 = timestamp3 } Sekunden = timestamp4 Ausgabe Sekunden Zuvor wird aktueller timestamp von zieltimestamp abgezogen und das ergebniss in dem code oben zum rechnen verwendet. So: wie drücke ich das jetzt in dem javateil im ersten post aus? Ich hoffe die mathematik reicht chris

15.07.2010, 20:14
Benshy Benutzer Registriert seit: 08.08.2009 Beiträge: 95 PHP-Kenntnisse: Anfänger	Ich habe nach hilfe gebeten und finde es von dir eine Frechheit mich als jemanden zu bezeichnen der keine schulbildung hat. Ich gehe davon aus, das mir ein ansatz gegeben wird, evtl. Auch ein tutorial, das dieses thema für anfänger beschreibt. Ich habe in meinem ersten post mitgeteilt das ich in javascript ein blutiger noob bin, als hinweis für euch versierte personen, damit ihr wisst das es hier um grundwissen mitgeht. Und dann kommt so eine antwort von dir. Eine antwort die mich und ander und keiner einzigen richtung weiterbringt. Und das in einem hilfeforum. Das ich hier grundsätzlich als Anfänger immer 1000 mal überlegen muss was ich hier frage ist mir schon klar, liegt aber wohl auch grundsätzlich an der einstellung eines versierten. Die topprogrammierer kommen mir einfach nur hochnäßig vor und möchten anfängern gar nicht helfen. Es gibt ausnahmen, vielleicht bist du ja eine. Und sry, kränken wollte ich dich nicht.

15.07.2010, 23:23
ChrisB Moderator¹ Registriert seit: 28.03.2010 Beiträge: 7.470 PHP-Kenntnisse: Fortgeschritten	document.write kannst du nur verwenden, während das Dokument geladen wird. Benutzt du es anschließend noch, dann ersetzt es das aktuelle Dokument vollständig. Du kannst aber bspw. innerHTML benutzen, um das ganze einfach als Inhalt in ein vorhandenes Element zu schreiben. Bitte nicht die im dortigen Beispiel verwendete document.all-Syntax benutzen, das ist eine MS-Erfindung - stattdessen bspw. per getElementById auf das Element zugreifen. Beispiel: Code: <div id="countdownAusgabe"></div> document.getElementById("countdownAusgabe").innerHTML = ...; Dazu muss das Element aber schon existieren, also entweder Script-Element erst nach diesem im Dokument unterbringen, oder die Funktion erst per onload aufrufen. __________________ RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

15.07.2010, 23:38
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Vor allem - wieso sollte sich auch die Variable ändern? Das einzige was Du antriggerst ist die Ausgabe der ermittelten Werte. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

16.07.2010, 01:59
Benshy Benutzer Registriert seit: 08.08.2009 Beiträge: 95 PHP-Kenntnisse: Anfänger	So, habs gelöst: Hier die Lösung in folgenden Thread: http://www.php.de/scriptboerse/69775...-versehen.html ([Erledigt] Countdown mit Tage und Stunden versehen.) Geändert von Benshy (18.07.2010 um 01:03 Uhr).