TechCodeview

En aquest article, aprendrem a obtenir els valors seleccionats a la llista desplegable amb l'ajuda de jQuery. En primer lloc, entendrem aquest article utilitzant jQuery, jQuery selector i jQuery val() method. Després d'això, entendrem aquest tema amb l'ajuda de diversos exemples.

Què vols dir amb jQuery?

jQuery és una biblioteca de JavaScript ràpida, lleugera, petita i rica en funcions.

Utilitzeu el jQuery: selector seleccionat en combinació amb el mètode val () per trobar el valor de l'opció seleccionada en una llista desplegable.

El selector de jQuery:

És un element HTML en el qual s'aplica la declaració.

cua java

Per exemple: seleccionat, marcat, etc.

Selected s'utilitza per especificar l'opció predeterminada quan es carrega inicialment el formulari.

mètode val () a jQuery:

Aquest mètode s'utilitza per obtenir els valors dels elements del formulari o establir el valor de l'atribut utilitzat per als elements seleccionats.

Sintaxi:

 $(selector).val (); 

Exemple:

 $('input: text').val ('javaTpoint!'); 

Llista desplegable amb i etiqueta.

Les etiquetes de selecció i opció s'utilitzen per crear menús desplegables. Permeten a l'usuari seleccionar opcions simples o múltiples d'una llista d'opcions. Totes les opcions no es mostren a la pantalla, però són visibles quan es mostren a la llista desplegable. S'utilitzen per estalviar espai, ja que només es mostra un element de la llista.

Per crear llistes desplegables, s'utilitza l'etiqueta en lloc de l'etiqueta . L'etiqueta emparellada comença amb l'etiqueta d'obertura i acaba amb l'etiqueta de tancament. Aquesta etiqueta s'ha d'utilitzar amb l'etiqueta .

Sintaxi:

 Text Label-1 Text Label-2 ………………………………………………………………………………………………….. ………………………………………………………………………………………………….. 

Els diferents atributs utilitzats amb l'etiqueta són:

java inicialitza la matriu

Múltiples:S'utilitza per configurar l'etiqueta perquè accepti nombroses opcions. Per defecte, pot prendre una única opció seleccionada per l'usuari. Per seleccionar diverses opcions, un usuari ha de prémer clic mentre fa clic a l'opció.Nom:S'utilitza per especificar un nom per a la llista desplegable.

Els diferents atributs utilitzats amb l'etiqueta són:

Valor:S'utilitza per especificar el valor que s'envia quan s'envia el formulari. Si s'omet l'atribut value a l'etiqueta, s'utilitza el contingut del títol.Seleccionat:S'utilitza per especificar l'opció preseleccionada quan el formulari es carrega inicialment en un navegador.

Els exemples següents s'utilitzen per obtenir el valor seleccionat de la llista desplegable de jQuery.

Exemple 1:

Com obtenir el valor seleccionat de la llista desplegable a 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> 

Explicació:

A l'exemple anterior, hem creat una llista desplegable amb l'ajuda de i etiquetar. En això, si seleccionem un valor múltiple de la llista i creem un després de seleccionar l'element múltiple de la llista i fer clic a un botó, mostra un missatge d'alerta amb l'element seleccionat de la llista desplegable.

edat de kylie jenner

 United States India United Kingdom Brazil Germany <br> <br> <b> Get selected values from list </b> 

Aquí,

Size ='3' s'utilitza per mostrar el nombre d'elements que es mostra a la llista desplegable, multiple s'utilitza per seleccionar diversos valors de la llista desplegable.

Sortida:

La sortida d'aquest exemple es mostra a continuació.