În acest articol, vom învăța cum să obținem valorile selectate în lista derulantă cu ajutorul jQuery. În primul rând, vom înțelege acest articol folosind jQuery, jQuery selector și jQuery val() metoda. După aceea, vom înțelege acest subiect cu ajutorul diverselor exemple.
Ce vrei să spui prin jQuery?
jQuery este o bibliotecă JavaScript rapidă, ușoară, mică și bogată în funcții.
Utilizați jQuery: selectorul selectat în combinație cu metoda val () pentru a găsi valoarea opțiunii selectate într-o listă derulantă.
xd sens
Selectorul din jQuery:
Este un element HTML în care se aplică declarația.
De exemplu: selectat, bifat etc.
Selectat este folosit pentru a specifica alegerea implicită atunci când formularul este încărcat inițial.
metoda val () în jQuery:
Această metodă este utilizată pentru a obține valorile elementelor de formular sau pentru a seta valoarea atributului utilizat pentru elementele selectate.
Sintaxă:
$(selector).val ();
Exemplu:
$('input: text').val ('javaTpoint!');
Listă derulantă cu și etichetă.
Etichetele de selectare și opțiune sunt folosite pentru a crea meniuri derulante. Acestea permit utilizatorului să selecteze opțiuni simple sau multiple dintr-o listă de opțiuni. Toate opțiunile nu sunt afișate pe ecran, dar sunt vizibile atunci când trag lista derulantă. Sunt folosite pentru a economisi spațiu, deoarece este afișat un singur articol din listă.
bucla java do while
Pentru crearea listelor derulante, eticheta este folosită în loc de tag . Eticheta asociată începe cu eticheta de deschidere și se termină cu eticheta de închidere . Această etichetă trebuie utilizată împreună cu eticheta .
Sintaxă:
structuri de date java
Text Label-1 Text Label-2 ………………………………………………………………………………………………….. …………………………………………………………………………………………………..
Diferitele atribute utilizate cu eticheta sunt:
Diferitele atribute utilizate cu eticheta sunt:
Următoarele exemple sunt folosite pentru a obține valoarea selectată din lista derulantă din jQuery.
Exemplul 1:
Cum să obțineți valoarea selectată din lista derulantă în jQuery.
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>
Explicaţie:
În exemplul de mai sus, am creat o listă derulantă cu ajutorul și eticheta. În aceasta, dacă selectăm o valoare multiplă din listă și creăm un după ce selectăm elementul multiplu din listă și facem clic pe un buton acesta afișează un mesaj de alertă cu elementul selectat din lista derulantă.
jvm
United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b>
Aici,
Dimensiunea ='3' este folosit pentru a afișa numărul de elemente afișate în lista derulantă, multiple este folosit pentru a selecta mai multe valori din lista derulantă.
Ieșire:
Rezultatul acestui exemplu este prezentat mai jos.