logo

jQuery kiekvienas() metodas

The kiekvienas () jQuery metodas nurodo funkciją, kuri vykdoma kiekvienam suderintam elementui. Tai vienas iš JQuery plačiai naudojamų perėjimo metodų. Naudodami šį metodą galime pakartoti jQuery objekto DOM elementus ir atlikti funkciją kiekvienam suderintam elementui.

The kiekvienas () priima parametrą funkcija (indeksas, elementas) kuri yra atgalinio skambinimo funkcija, kuri vykdoma kiekvienam pasirinktam elementui. Šiai funkcijai papildomai reikia dviejų parametrų, kurie yra indeksas ir elementas. Taigi, mes turime perduoti atšaukimo funkciją kiekvienam () metodui.

Galime ir grįžti klaidinga iš perskambinimo funkcijos, kad anksti sustabdytumėte kilpą.

Sintaksė

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

Parametrų reikšmės

Naudojamos parametrų reikšmės kiekvienas () metodas apibrėžiamas taip.

funkcija (indeksas, elementas): Tai yra privalomas parametras. Tai yra atgalinio skambinimo funkcija, kuri vykdoma kiekvienam pasirinktam elementui. Jame yra dvi parametrų reikšmės, kurios apibrėžtos taip.

    indeksas:Tai sveikasis skaičius, nurodantis parinkiklio indekso padėtį.elementas:Tai dabartinis elementas. Šį raktinį žodį galime naudoti norėdami nurodyti šiuo metu atitinkantį elementą.

Pažiūrėkime keletą iliustracijų, kad suprastume kiekvienas () metodas aiškiai.

1 pavyzdys

Šiame pavyzdyje kiekvienas () metodas bus suaktyvintas spustelėjus mygtuką. Šį metodą taikome kad elementai. Taigi, šis metodas bus kartojamas kiekvienam kad elementas. Funkcija vykdoma kiekvienam pasirinktam kad ir rodo atitinkamo tekstą kad elementas naudojant įspėjimo laukelį.

pašalinti angular cli

Čia nenaudojame atgalinio skambinimo funkcijos parametrų reikšmių.

 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()) }); }); } 

Išvestis

Išbandykite dabar

Įvykdžius aukščiau pateiktą kodą, išvestis bus -

jQuery kiekvienas() metodas

Spustelėjus mygtuką, bus rodomas toks įspėjimas.

jQuery kiekvienas() metodas

Panašiai bus rodomi keturi įspėjimo laukeliai dėl keturių kad elementai.

2 pavyzdys

Šiame pavyzdyje mes naudojame atgalinio skambinimo funkcijos parametrų reikšmes, kurios yra indeksas ir elementas .

Mes taikome kiekvienas () metodas įjungtas kad elementai. Taigi metodas bus kartojamas per li elementus, pradedant nuo indekso 0 . Jis bus vykdomas kiekvienam pasirinktam kad elementą ir pakeiskite atitinkamo elemento fono spalvą.

Iteracija sustoja, kai funkcija grįžta klaidinga . Čia yra šeši kad elementai, o funkcija sustoja, kai pasiekia elementą su id = 'i4' . Nors tai yra ketvirtas elementas, bet indeksas prasideda nuo 0 , taigi elemento padėtis yra 3 .

ketvirtį versle
 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; } }); }); } 

Išvestis

Išbandykite dabar

Įvykdžius aukščiau pateiktą kodą ir spustelėjus nurodytą mygtuką, išvestis bus -

jQuery kiekvienas() metodas