logo

Metoda jQuery each().

The vsak() metoda v jQuery podaja funkcijo, ki se izvaja za vsak ujemajoči se element. Je ena izmed pogosto uporabljenih metod prečkanja v JQueryju. S to metodo lahko iteriramo po elementih DOM objekta jQuery in lahko izvedemo funkcijo za vsak ujemajoči se element.

The vsak() sprejme parameter funkcija (indeks, element) ki je funkcija povratnega klica, ki se izvede za vsak izbrani element. Ta funkcija nadalje neobvezno zahteva dva parametra, in sicer indeks in element. Zato moramo metodi each() posredovati funkcijo povratnega klica.

Lahko se tudi vrnemo lažno iz funkcije povratnega klica, da predčasno zaustavite zanko.

Sintaksa

 $(selector).each(function(index, element)) 

Vrednosti parametrov

Vrednosti parametrov, ki se uporabljajo v vsak() metode so opredeljene kot sledi.

funkcija (indeks, element): Je obvezen parameter. To je funkcija povratnega klica, ki se izvede za vsak izbrani element. Ima dve vrednosti parametrov, ki sta definirani na naslednji način.

    kazalo:To je celoštevilska vrednost, ki določa položaj indeksa izbirnika.element:To je trenutni element. To ključno besedo lahko uporabimo za sklicevanje na trenutno ujemajoči se element.

Oglejmo si nekaj ilustracij, da bomo razumeli vsak() metoda jasno.

Primer1

V tem primeru je vsak() metoda se bo sprožila ob kliku na gumb. To metodo uporabljamo pri to elementi. Torej bo ta metoda ponavljala vsakega to element. Funkcija se izvede za vsako izbrano to in prikaže besedilo ustreznega to element z opozorilnim poljem.

Tukaj ne uporabljamo vrednosti parametrov funkcije povratnega klica.

 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(){ $(&apos;li&apos;).each(function(){ alert($(this).text()) }); }); } 

Izhod

Preizkusite zdaj

Po izvedbi zgornje kode bo rezultat -

Metoda jQuery each().

Ko kliknete gumb, se prikaže naslednje opozorilo.

Metoda jQuery each().

Podobno bodo prikazana štiri opozorilna polja zaradi štirih to elementi.

Primer2

V tem primeru uporabljamo vrednosti parametrov funkcije povratnega klica, ki so kazalo in element .

Uporabljamo vsak() metoda na to elementi. Torej bo metoda ponavljala elemente li, začenši z indeksom 0 . Izvedel se bo na vsakem izbranem to element in spremenite barvo ozadja ustreznega elementa.

Ponovitev se ustavi, ko se funkcija vrne lažno . Tukaj jih je šest to elementov, funkcija pa se ustavi, ko doseže element z id = 'i4' . Čeprav je četrti element, se indeks začne pri 0 , torej je položaj elementa 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(){ $(&apos;li&apos;).each(function(index, element) { $(element).css(&apos;background&apos;, &apos;lightgreen&apos;); if ($(this).is(&apos;#i4&apos;)) { $(&apos;p&apos;).text(&apos;Index begins with 0. So, the function stopped at position: &apos; + index ).css(&apos;fontSize&apos;, &apos;20px&apos;); return false; } }); }); } 

Izhod

Preizkusite zdaj

Po izvedbi zgornje kode in kliku danega gumba bo rezultat -

Metoda jQuery each().