Jak zatrzymać interwał w JavaScript?

W trakcie wdrażania różnych funkcji w tym samym czasie istnieje potrzeba wyłączenia określonej funkcji przez pewien czas. Pomaga to w obserwowaniu działania każdej funkcji. Czasami istnieje wymóg wyświetlania określonej funkcjonalności przez określony czas, a następnie wyłączyć. W takich przypadkach zatrzymanie interwału w JavaScript jest bardzo pomocne w radzeniu sobie z takimi sytuacjami.

Jak zatrzymać interwał w JavaScript?

Następujące podejścia można zastosować w połączeniu z „setInterval ()„Metoda zatrzymania interwału w JavaScript:

• "Wartość logiczna" zbliżać się.
• „„JQuery" zbliżać się.
• "clearInterval ()" metoda.

Podejście 1: Zatrzymaj interwał w JavaScript przy użyciu metody setInterval () z podejściem wartości logicznej

„„setInterval ()”Metoda wywołuje konkretną funkcję w określonych odstępach wielokrotnie. Takie podejście można wdrożyć w celu przypisania określonej wartości logicznej do funkcji, która ma być dostępna, co spowoduje zatrzymanie i usunięcie interwału zestawu.

Składnia

setInterval (funkcja, milisekund)

W powyższej składni:

• "funkcjonować”Odnosi się do funkcji do wykonania i„milisekund”To przedział czasu.

Przykład

Aby to zademonstrować, utwórz dokument HTML i umieść następujące wiersze w nim:

= „Head”> sekundy:



Wznawiać
Pauza

W powyższym kodzie:

• W „„”Tag, dołącz„Zakres”Element za uwzględnienie sekund do upływu.
• Następnie utwórz dwa przyciski z załączonym „na kliknięcie„Przekierowanie zdarzeń do dwóch oddzielnych funkcji.
• Jeden z utworzonych przycisków spowoduje zatrzymanie interwału, a drugi.

Teraz w części kodu JavaScript:

varget = dokument.getElementById („głowa”);
var pauzed = false;
var elapsedtime = 0;
var t = setInterval (function ()
Jeśli(!zatoce)
ElapsedTime ++;
Dostawać.innerText = "upłynęło sekundy:" + upływ czasu;

, 1000);
funkcjaSumeInterval ()
zatoce = false;

FunketPauseInterval ()
zatoce = true;

W powyższym fragmencie kodu:

• Uzyskać dostęp do "Zakres”Element po określonym„ID" używając "dokument.getElementById ()" metoda.
• W następnym kroku przypisz wartość logiczną „FAŁSZ" do "Zatrzymany" zmienny. Podobnie zainicjuj zmienną „upłynął czas" z "0„Aby to zwiększyć.
• Teraz zastosuj „setInterval ()”Metoda funkcji i zwiększania zainicjowanego upływu czasu w postaci sekund, ponieważ przedział jest ustawiony na (1000 milisekund = 1 sekunda)
• W następnym kroku zadeklaruj funkcję o nazwie „ResumeInterval ()". Tutaj przypisz wartość logiczną jako „FAŁSZ„Do wcześniej przypisanej zmiennej”Zatrzymany". Spowoduje to wznowienie zatrzymanego przedziału przy kliknięciu przycisku.
• Podobnie zdefiniuj funkcję o nazwie „pauseInterval ()”, Który zatrzyma ustawiony interwał, przypisując wartość logiczną, podobnie jak omówiono.

Wyjście

Na powyższej mocy można zaobserwować, że pożądane wymaganie jest spełnione.

Podejście 2: Zatrzymaj interwał w JavaScript za pomocą metody setInterval () z podejściem jQuery

Takie podejście można zaimplementować, aby uzyskać bezpośredni dostęp do przycisku, dołączyć zdarzenie i przypisać wartość logiczną.

Składnia

setInterval (funkcja, milisekund)

W powyższej składni:

• "funkcjonować”Odnosi się do funkcji do wykonania i„milisekund”To przedział czasu.

Przykład

Poniższy kod-snippet wykazał koncepcję:

= „Head”> sekundy:



Wznawiać
Pauza

W powyższym kodzie:

• Po pierwsze, dołącz „JQuery" biblioteka.
• W następnym kroku ożywij omawiane podejście do włączenia „Zakres„Element w celu zgromadzenia”sekundy" w tym.
• Następnie podobnie dołącz dwa oddzielne przyciski do zatrzymywania i wznowienia zatrzymanego przedziału.

W części jQuery przejdź przez następujące wiersze kodu:

var get = $ ('span');
var pauzed = false;
var elapsedtime = 0;
var t = okno.setInterval (function ()
Jeśli(!zatoce)
ElapsedTime ++;
Dostawać.tekst („upłynęły sekundy:” + upływ czasu);

, 1000);
$ ('.pauza').on („kliknij”, funkcja ()
zatoce = true;
);
$ ('.grać').on („kliknij”, funkcja ()
zatoce = false;
);

W powyższym kodzie wykonaj określone kroki:

• Pobierz „Zakres„Element, wskazując na„elementy" nazwa.
• Podobnie w dalszym kodeksie przydziel wartość logiczną do „Zatrzymany”Zmienna i zainicjuj upływający czas za pomocą„0".
• Teraz ożywij omawiane podejście do zastosowania „setInterval ()”Metoda do funkcji i podobnie zwiększając czas upływający w postaci sekund.
• Wreszcie, dołącz „Kliknij”Wydarzenie zarówno dostępnych przycisków, jak i przypisz podaną wartość logiczną do każdego z przycisków za pomocą jQuery”NA()" metoda.

Wyjście

W wyżej podanej wydajności widać, że timer jest zatrzymywany i pomyślnie wznowiony.

Podejście 3: Zatrzymaj interwał w JavaScript przy użyciu metody setInterval () metodą ClearInterval ()

„„clearInterval ()”Metoda wyczyszcza składnik Timer w metodzie setInterval (). Tę metodę można wykorzystać do zatrzymania zestawu ustawionego ”na stałe".

Składnia

setInterval (funkcja, milisekund)

W powyższej składni:

• "funkcjonować”Odnosi się do funkcji do wykonania i„milisekund”To ustalony przedział czasu.

ClearInterval (interwał)

W powyższej składni:

• "interwał”Odnosi się do przedziału zwróconego z metody setInterval ()

Przykład

Przejrzyj określone wiersze kodu:

= „head” style = "font-Weight: Bold;"> sekundy:



Pauza

• Tutaj powtórz omawiane kroki w poprzednich metodach włączenia „Zakres" element.
• Podobnie w następnym kroku utwórz przycisk z „na kliknięcie„Wydarzenie wywołujące funkcję pauseInterval ().

Wykonaj określone kroki w części kodu JavaScript:

varget = dokument.getElementById („głowa”);
var elapsedtime = 0;
var t = setInterval (function ()
ElapsedTime ++;
Dostawać.innerText = "upłynęło sekundy:" + upływ czasu;
, 1000);
FunketPauseInterval ()
clearInterval (t);

• W pierwszym kroku podobnie dostęp do „Zakres”Element po„ID" używając "dokument.getElementById ()" metoda.
• Powtórz omawiane metody inicjalizacji „upłynął„Czas, stosując„setInterval ()”Metoda i zwiększanie określonego upływu czasu zgodnie z ustawionym przedziałem.
• Wreszcie zadeklaruj funkcję o nazwie „pauseInterval ()". Tutaj zastosuj „clearInterval ()„Metoda posiadająca funkcję„T”Jako jego parametr, na którym ustawiono interwał. Spowoduje to trwałe zatrzymanie ustawionego przedziału.

Wyjście

Tutaj timer jest zatrzymywany na stałe.

Zebraliśmy podejście do zatrzymania interwału w JavaScript.

Wniosek

„„wartość logiczna„Podejście,„JQuery”Podejście lub„clearInterval ()„Metoda można zastosować, aby zatrzymać interwał w JavaScript. Pierwsze podejście można zastosować, aby przypisać odpowiednią wartość logiczną po dostępnej funkcji, aby zatrzymać się i wznowić ustawiony timer. Podejście JQuery można wykorzystać do bezpośredniego dostępu do przycisku, dołączenia zdarzenia i przypisania wartości logicznej, co skutkuje ogólnie mniejszą złożonością kodu. Metodę ClearInterval () można zaimplementować, aby zatrzymać ustawiony interwał na stałe. W tym samouczku wyjaśniono podejście do zatrzymania interwału w JavaScript.