Zegarek w JavaScript - funkcja setTimeout() się nie wykonuje

Question

Witam, stworzyłem zegarek dokładnie tak, jak jest pokazane na kursie pana Zelenta. Wszystko działało. 

Potem chciałem dodać drugi zegarek linijkę niżej, z tym że ten drugi liczyłby czas od zera. I wciąż cały kod się wykonuje, tylko ostatnie polecenie setTimeout() nie działa, więc zegarki "nie chodzą". Skrypt poniżej. 

<script type="text/javascript">


window.onload = start;

function start()
{
	zegarek(0,0,0);
}

function zegarek(Qgodzina,Qminuta,Qsekunda)
{
	
	var dzisiaj = new Date();
	
	var godzina = dzisiaj.getHours(); if(godzina<10) godzina="0"+godzina;
 	var minuta = dzisiaj.getMinutes(); if(minuta<10) minuta="0"+minuta;
	var sekunda = dzisiaj.getSeconds(); if(sekunda<10) sekunda="0"+sekunda;
	
	document.getElementById("z").innerHTML = 
	godzina + ":" + minuta + ":" + sekunda;
	
	if(Qminuta==59 && Qsekunda==59)
	{
		Qgodzina++;
		Qminuta=0; Qsekunda=0;
	}
	else if(Qsekunda==59)
	{
		Qminuta++;
		Qsekunda=0;
	}
	else Qsekunda++;
	
	document.getElementById("q").innerHTML = 
	Qgodzina+":"+Qminuta+":"+Qsekunda;
	
	setTimeout("zegarek(Qgodzina,Qminuta,Qsekunda)", 1000); 

}

</script>

 

Z góry dzięki za pomoc. 

Comments

Gdzie jest ten drugi "zegarek"?

Do setTimeout przekazuj referencję funkcji lub twórz tam funkcję anonimową i wewnątrz niej swój kod. Nie przekazuj tam stringa, bo kod będzie puszczony przez eval, co jest złą praktyką.

Czy w konsoli są jakieś błędy?

---

Czyli co mam zmienić? Co to znaczy przekazuj referencję funkcji lub twórz tam funkcję anonimową i wewnątrz niej swój kod? Jestem jeszcze zielony. 

---

 A w konsoli jest tak:

Uncaught ReferenceError: Qgodzina is not defined
    at <anonymous>:1:9

---

Referencję do funkcji przekazujesz, gdy jako parametr przesyłasz nazwę funkcji. Tak jak w przypadku obiektów. Funkcje w JavaScript są obiektami, co oznacza że możesz przypisywać im propertisy (pole i metody) - lecz funkcje cechują się tym, że możesz wywołać kod umieszczony w ich ciele. Posiadają też inne "ficzery", ale o tym sobie poczytaj w dokumentacji.

---

W ogóle to jest problematyczne, no bo jak chciałbym dopisać "0" do zmiennych mniejszych od 10 (żeby było 19:00 a nie 19:0) to te zmienne przestaną być int'ami i nie będzie można prowadzić na nich operacji matematycznych.

---

W ogóle to jest problematyczne, no bo jak chciałbym dopisać "0" do zmiennych 

Operator dodawania, jeśli w operacji uczestniczą wartości typu string, wykonuje konkatenację, czyli łączenie łańcuchów znaków. Aby temu zaradzić rzutuj sobie wartości numeryczne, które masz zapisane jako string, na typ number (np. parseInt, parseFloat), albo po prostu zapisuj liczby jako number.

---

Tak to zrobiłem

setTimeout(function() { 
zegarek( parseInt(Qgodzina), parseInt(Qminuta), 
parseInt(Qsekunda) );}, 1000);

 

Answer 1

Uncaught ReferenceError: Qgodzina is not defined 
    at <anonymous>:1:9

To jest efekt uboczny użycia eval. Zmienna Qgodzina i reszta, która przekazywana jest do funkcji zegarek była przesłana z funkcji start, a więc wartości te nie należą do globalnego scope (zostały utworzone lokalnie). Natomiast korzystając z eval JavaScript próbował szukać tych zmiennych w global scope.

Dlatego przekaż do setTimeout funkcję anonimową, w której wywołasz funkcję zegarek z parametrami:

setTimeout(function() { 
    zegarek(Qgodzina,Qminuta,Qsekunda);
}, 1000);

Comments

Aha, już skumałem. Działa, Dzięki za pomoc.