Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Timer i wyłączenie setInterval
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
miccom
Dzień dobry smile.gif

Mam taki oto skrypt timera na stronie:

  1. counter = new Array();
  2. function loadTimer(czas,lokalizacjaTimera,idTimera){
  3. var s = czas;
  4. counter.idTimera = setInterval(timer, 1000); // ustawienie funkcji odpowiedajacej za cykliczne wywolanie(co 1 s) funkcji timer()
  5. var min = s / 60; // minuty
  6. var h = min / 60; // godziny
  7. var sLeft = Math.floor(s % 60); // pozostało sekund
  8. var minLeft = Math.floor(min % 60); // pozostało minut
  9. var hLeft = Math.floor(h); // pozostało godzin
  10.  
  11. if (minLeft < 10)
  12. minLeft = "0" + minLeft;
  13. if (sLeft < 10)
  14. sLeft = "0" + sLeft;
  15.  
  16. var out = hLeft + ":" + minLeft + ":" + sLeft; //tekst wyswietlony uzytkownikowi
  17. document.getElementById(""+lokalizacjaTimera+"").innerHTML = out;
  18.  
  19. $("#"+lokalizacjaTimera+"").html(out); // przypisanie tekstu timera do odpowiedniego elementu html
  20. function timer()
  21. {
  22. --s;
  23. var min = s / 60; // minuty
  24. var h = min / 60; // godziny
  25. var sLeft = Math.floor(s % 60); // pozostało sekund
  26. var minLeft = Math.floor(min % 60); // pozostało minut
  27. var hLeft = Math.floor(h); // pozostało godzin
  28.  
  29. if (minLeft < 10)
  30. minLeft = "0" + minLeft;
  31. if (sLeft < 10)
  32. sLeft = "0" + sLeft;
  33. var out = hLeft + ":" + minLeft + ":" + sLeft; //tekst wyswietlony uzytkownikowi
  34. $("#"+lokalizacjaTimera+"").html(out); // przypisanie tekstu timera do odpowiedniego elementu html
  35. if( s <= 0) //licznik osiągnął 0
  36. {
  37. //licznik się wyzerował należy podjąć odpowiednią akcje
  38. clearInterval(counter.idTimera); //zatrzymanie licznika
  39. console.log("kasujemy timer id="+idTimera);
  40. $.ajax({
  41. type : "POST",
  42. dataType : "json",
  43. url : "up.php",
  44. data : {
  45. 'idTimera':idTimera},
  46. success: function(data) {
  47. if (data.error)
  48. {
  49. alert("wystąpił błąd"+data.error);
  50. }
  51. else
  52. {
  53. alert("zadanie zakończone");
  54. }
  55. }
  56. });
  57. return;
  58. }
  59. }
  60. }


A wywołuję go tak:

  1. $(document).ready(function() {
  2. loadTimer(<?php echo $wnetrzePracownika['time'];?>,'timer<?php echo $kolejnyNumer;?>',<?php echo $kolejnyNumer;?>);
  3. });

I jeśli jeden Interwał jest uruchomiony to wszystko pięknie działa i interwał zostaje wyłączony, natomiast jeśli jest kilka uruchomionych to mimo wykonania zadania interwał nadal działa.
I tutaj moje pytanie, jak wyłączyć setInterval jeśli np. są 4 uruchomione?
Proszę o pomoc.
Comandeer
Wykorzystuj zmienną counter jako tablicę i dodawaj tam wszystkie timery. Wówczas będziesz miał dostęp do wszystkich i spokojnie se usuniesz. Na razie po prostu dodajesz i nadpisujesz własności statyczne pustej tablicy
miccom
OK, a możesz jaśniej? Bo nie rozumiem co napisałeś?

Tworzę tablicę:
  1. counter = new Array();

A następnie do countera dopisuję idTimera
  1. counter.idTimera = setInterval(timer, 1000);


Czy to nie jednoznaczne z dodaniem do tablicy counter rekordu idTimera?

czy tak to ma wyglądać?
  1. counter[idTimera] = setInterval(timer, 1000);
Comandeer
Nie. Tablica dalej jest pusta (możesz to sprawdzić sprawdzając counter.length).

Z racji tego, że w JS tablice są po prostu specyficznym typem obiektów, zapis typu tablica.wlasnosc działa tak samo jak obiekt.wlasnosc.

Jak chcesz coś dodać do tablicy, najłatwiej użyć counter.push
miccom
OK.
Nie rozumiem:) ale zrobiłem tak:
  1. counter.push(setInterval(timer, 1000));


i przy
  1. console.log("counter="+ counter.length);


widzę odpowiednio ilości timerów uruchomionych.
Jak teraz jeden z nich zatrzymać?
Comandeer
Hmm… może taki przykład coś Ci pomoże: http://jsfiddle.net/Comandeer/skquys49/
sazian
Kod
var counter =[];
counter.push(setInterval(function(){console.log('a')}, 1000));
counter.push(setInterval(function(){console.log('b')}, 1000));
counter.push(setInterval(function(){console.log('c')}, 1000));
clearInterval(counter[0]);
miccom
ok sazian, a jeśli nie są po kolei timery?

  1. var counter =[];
  2. counter.push(setInterval(function(){console.log('a')}, 1000));
  3. counter.push(setInterval(function(){console.log('b')}, 1000));
  4. counter.push(setInterval(function(){console.log('c')}, 1000));
  5. clearInterval(counter[0]);

Na końcu usuwamy counter[0], a gdybym chciał te countery ponumerować?
i dać np. counter[1], counter[13], counter[5] itd?

Jeden timer ma np. 1 minutę, drugi 7 minut a trzeci 2 minuty...
Comandeer
To poczytaj kod z mojego przykładu wink.gif

push zwraca indeks tablicy, więc wystarczy ten fakt wykorzystać (zadeklarować zmienną w funkcji loadTimer)
miccom
coś takiego?
  1. pushed = counter.push(setInterval(timer, 1000));


Jak dam potem
  1. clearInterval(pushed);

to nie zatrzymuje mi timera.
Nic nie rozumiem z Twojego przykładu.
Możesz przygotować przykład z kilkoma timerami z różnie upływającym czasem i automatyczne kasowanie timera ( setInterval ) przy wyzerowaniu czasu?
Comandeer
Kod
clearInterval(pushed - 1);

Miałem napisać, że zwraca długość tablicy. A indeks ostatniego elementu to długość - 1.
miccom
Ok, poradziłem sobie w taki sposób, że dodałem zmienną tylko dla setInterval równą idTimera.

  1. var timerID = idTimera;
  2. timerID = setInterval(timer, 1000);


Więc aby wyłączyć timer należy tylko wykonać clearInterval
  1. clearInterval(timerID);

I pięknie działa.
Dziękuje za naprowadzenie mnie na rozwiązanie.

Pozdrawiam.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2024 Invision Power Services, Inc.