The każdy() metoda w jQuery określa funkcję uruchamianą dla każdego dopasowanego elementu. Jest to jedna z powszechnie stosowanych metod przechodzenia w JQuery. Korzystając z tej metody, możemy iterować po elementach DOM obiektu jQuery i wykonywać funkcję dla każdego dopasowanego elementu.
The każdy() akceptuje parametr funkcja(indeks,element) która jest funkcją wywołania zwrotnego wykonywaną dla każdego wybranego elementu. Ta funkcja dodatkowo opcjonalnie wymaga dwóch parametrów, którymi są indeks i element. Musimy więc przekazać funkcję wywołania zwrotnego do metody each().
Możemy również wrócić FAŁSZ z funkcji wywołania zwrotnego, aby wcześniej zatrzymać pętlę.
psy półkowe
Składnia
$(selector).each(function(index, element))
Wartości parametrów
Wartości parametrów używane w każdy() metodę definiuje się w następujący sposób.
funkcja(indeks,element): Jest to parametr obowiązkowy. Jest to funkcja wywołania zwrotnego, która jest wykonywana dla każdego wybranego elementu. Ma dwie wartości parametrów, które są zdefiniowane w następujący sposób.
Zobaczmy kilka ilustracji, aby zrozumieć każdy() metoda wyraźnie.
Przykład 1
W tym przykładzie każdy() Metoda zostanie uruchomiona po kliknięciu przycisku. Stosujemy tę metodę do To elementy. Zatem ta metoda będzie iterować po każdym z nich To element. Funkcja jest wykonywana dla każdego wybranego To i wyświetla odpowiedni tekst To element za pomocą pola alertu.
Tutaj nie używamy wartości parametrów funkcji wywołania zwrotnego.
jQuery each() method <h2> Welcome to the javaTpoint.com </h2> <ul> <li> First element </li> <li> Second element </li> <li> Third element </li> <li> Fourth element </li> </ul> <p> Click the following button to see the list of <b> li </b> elements. </p> Click me function fun(){ $(document).ready(function(){ $('li').each(function(){ alert($(this).text()) }); }); }
Wyjście
sortowanie listy JavaPrzetestuj teraz
Po wykonaniu powyższego kodu wyjściem będzie -
Po kliknięciu przycisku wyświetli się alert w następujący sposób.
Podobnie zostaną wyświetlone cztery okna alertów z powodu czterech To elementy.
c# zawiera ciąg
Przykład2
W tym przykładzie używamy wartości parametrów funkcji wywołania zwrotnego, które są indeks I element .
Stosujemy każdy() metoda włączona To elementy. Zatem metoda będzie iterować po elementach li, zaczynając od indeksu 0 . Zostanie wykonane na każdym wybranym To element i zmień kolor tła odpowiedniego elementu.
Iteracja kończy się po powrocie funkcji FAŁSZ . Tutaj jest ich sześć To elementów, a funkcja zatrzymuje się, gdy dotrze do elementu za pomocą identyfikator = 'i4' . Co prawda jest to czwarty element, ale indeks zaczyna się od 0 , więc położenie elementu wynosi 3 .
jQuery each() method body{ text-align: center; } ul{ list-style-type: none; float: left; } li { width: 40px; height: 40px; margin: 5px; padding: 5px; font-size: 20px; float: left; border: 2px solid blue; } button{ font-size: 20px; } <h2> Welcome to the javaTpoint.com </h2> <ul> <li> 1 </li> <li> 2 </li> <li> 3 </li> <li id="i4"> Stop </li> <li> 5 </li> <li> 6 </li> </ul> Click me function fun() { $(document).ready(function(){ $('li').each(function(index, element) { $(element).css('background', 'lightgreen'); if ($(this).is('#i4')) { $('p').text('Index begins with 0. So, the function stopped at position: ' + index ).css('fontSize', '20px'); return false; } }); }); }
Wyjście
Przetestuj terazPo wykonaniu powyższego kodu i kliknięciu danego przycisku wyjściem będzie -