U ovom ćemo članku naučiti kako uz pomoć jQueryja dobiti odabrane vrijednosti na padajućem popisu. Prije svega, razumjet ćemo ovaj članak koristeći jQuery, jQuery selektor i jQuery val () metodu. Nakon toga ćemo ovu temu razumjeti uz pomoć raznih primjera.
Što mislite pod jQuery?
jQuery je brza, lagana, mala JavaScript biblioteka bogata značajkama.
java arraylist
Koristite jQuery: odabrani birač u kombinaciji s metodom val () za pronalaženje odabrane vrijednosti opcije na padajućem popisu.
Selektor u jQueryju:
To je HTML element u kojem se primjenjuje deklaracija.
Na primjer: odabrano, provjereno itd.
Odabrano se koristi za određivanje zadanog izbora kada se obrazac inicijalno učita.
val () metoda u jQueryju:
Ova metoda se koristi za dobivanje vrijednosti elemenata obrasca ili postavljanje vrijednosti atributa koji se koristi za odabrane elemente.
Sintaksa:
$(selector).val ();
Primjer:
$('input: text').val ('javaTpoint!');
Padajući popis s oznakom i .
Oznake odabira i opcije koriste se za stvaranje padajućih izbornika. Omogućuju korisniku odabir jednog ili više izbora s popisa opcija. Svi izbori nisu prikazani na ekranu, ali su vidljivi kada povuku padajući popis. Koriste se za uštedu prostora jer se prikazuje samo jedna stavka na popisu.
Za izradu padajućih popisa koristi se oznaka umjesto oznake . Uparena oznaka počinje početnom oznakom i završava završnom oznakom. Ova oznaka se mora koristiti s oznakom .
Sintaksa:
str.zamijeniti u Javi
Text Label-1 Text Label-2 ………………………………………………………………………………………………….. …………………………………………………………………………………………………..
Razni atributi koji se koriste s oznakom su:
Razni atributi koji se koriste s oznakom su:
Sljedeći primjeri koriste se za dobivanje odabrane vrijednosti s padajućeg popisa u jQueryju.
Primjer 1:
Kako dobiti odabranu vrijednost s padajućeg popisa u jQueryju.
Get Selected Value in drop-down using jQuery h1 { color: green; } h5 { color: green; } h4 { color: green; } p { color: red; } .select { margin: 40px; width: 60%; height: 300px; padding: 30px; border: 2px solid green; } body { background-color: pink; } $(document).ready (function () { $('select.country').change (function () { var selectedCountry = $(this).children('option:selected').val(); alert ('You have selected the country - ' + selectedCountry); }); }); <p> <b> Get Selected Value in drop-down using jQuery </b> </p> <h4> Select Country from drop-down list: </h4> <br> United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b>
Obrazloženje:
U gornjem primjeru stvorili smo padajući popis uz pomoć oznake i . U ovom slučaju, ako odaberemo višestruku vrijednost s popisa i stvorimo a nakon odabira višestrukog elementa s popisa i klika na gumb, prikazuje se poruka upozorenja s odabranim elementom s padajućeg popisa.
sortiranje spajanjem
United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b>
Ovdje,
Veličina ='3' koristi se za prikaz broja elemenata prikazanih na padajućem popisu, višestruki se koristi za odabir višestrukih vrijednosti s padajućeg popisa.
Izlaz:
Rezultat ovog primjera je dat u nastavku.