Strona główna kursu

JavaScript - zdarzenia zależne od czasu, czas spędzony na stronie

DZIAŁANIE:

Jesteś na tej stronie :

sekund!
 

Kod:

Kurs JavaScript, Kurs Ajax, Kurs PHP

W BODY  :
Kurs JavaScript, Kurs Ajax, Kurs PHP

Ewentualne Objaśnienia:

Zapewne jeśli w jakiś sposób interesujesz się JS nieraz widziałeś gdzieś już taki przykład - odliczanie czasu spędzonego na stronie. To przykład stary jak świat, jego rozwiązania znajdziecie wszędzie jednak tutaj chodzi aby po prostu zrozumieć pewne mechanizmy, a nie koniecznie pokazać Wam, że jest to jakiś wspaniały praktyczny przykład, bo tak wcale nie musi być.

Mamy tutaj 2 funkcje - jedna bardzo prosta zwraca nam milisekundy od 1.01.1970 - o tym już wspominałem. Druga funkcja służy nam do określenia czasu jaki minął od wejścia na stronę do momentu bieżącego. Parametr start to moment pierwszego wywołania funkcji, czyli kiedy weszliśmy 1 raz na stronę; parametr aktualizacja to czas co jaki ma zostać wywoływana ponownie funkcja. Przy pierwszym wejściu na stronę czyli gdy start równa się 0 przypisujemy zmiennej bieżący czas (w milisekundach). Wartość ta pozostanie już taka sama, bo przy kolejnych wywołaniach start nie będzie już = 0 , więc nie dojdzie do modyfikacji tej zmiennej. Zmienna milisekundy pobiera obecny czas i dalej obliczamy sobie różnicę między pierwszym wejściem na stronę, a czasem obecnym. Różnice tą dzielimy przez 1000, aby uzyskać ten czas w sekundach oraz zaokrąglamy go poprzez Math.round . Obliczony czas w sekundach wpisujemy do pola formularza.
Ponownie wywołujemy funkcję czasNaStronie, gdzie parametrami jest start - czyli zawsze będzie to czas kiedy pierwszy raz weszliśmy na stronę i instrukcja onLoad (w Body) wywołała tę funkcję oraz aktualizacja, czyli co jaki czas ma zostać funkcja ponownie wywołana.

Zapewne zastanawiacie się dlaczego funkcję wywołujemy co pół sekundy, a nie co sekundę w końcu czas jest uaktualniany o wartość 1 sekundy. Jest to związane z możliwościami wystąpienia pewnych opóźnień. Nie będę tego dokładnie tłumaczył, jeśli masz ochotę zrób ten przykład z wartością 1000 zamiast 500 i sam zobaczysz ;)