logo

Obțineți valoarea selectată în meniul drop-down în jQuery.

Î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:

    Multiplu:Este folosit pentru a seta eticheta să accepte numeroase opțiuni. În mod implicit, poate lua o singură opțiune selectată de utilizator. Pentru a selecta mai multe opțiuni, un utilizator trebuie să apese clic în timp ce face clic pe opțiune.Nume:Este folosit pentru a specifica un nume pentru lista derulantă.

Diferitele atribute utilizate cu eticheta sunt:

    Valoare:Este folosit pentru a specifica valoarea care este trimisă la trimiterea formularului. Dacă atributul value este omis în etichetă, atunci se utilizează conținutul titlului.Selectat:Este folosit pentru a specifica alegerea preselectată atunci când formularul este încărcat inițial într-un browser.

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 () { $(&apos;select.country&apos;).change (function () { var selectedCountry = $(this).children(&apos;option:selected&apos;).val(); alert (&apos;You have selected the country - &apos; + 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.

Obțineți valoarea selectată în meniul drop-down în jQuery