Obtener el valor de un select (option) con jQuery

    

Vamos a ver cómo obtener el valor de un select con jQuery. Este campo desplegable es muy usado y muchas veces se requiere saber su valor antes de validarse el formulario al que pertenece.

En un post anterior hice mención y ejemplo práctico con jQuery para sacar dicho valor de un select, es el post del método jQuery change(). Ahora os lo detallo con calma.

Cómo obtener el valor de un select con jQuery change

En esta demo tenemos el ejemplo que casi seguro os puede valer para vuestros proyectos:

Os he puesto 3 formularios con campos select y mismo contenido, la diferencia entre los 3 radica en como voy a realizar la comprobación y asignación del cambio de valor de cada formulario.

  1. Comprobación/asignación de valor por atributo name. En la primera comprobación detecto el cambio de valor de un campo select de nombre ‘color1′, saco su valor con un alert y asigno su valor al input con jQuery val().
  2. Comprobación/asignación de valor por atributo id. En la segunda comprobación detecto que el elemento con id ‘ejemplo2′ cambia de valor, saco su valor con un alert y asigno su valor al input con jQuery val().
  3. Comprobación/asignación de valor por atributo class. En la tercera comprobación detecto como el elemento con class ‘ejemplo3′ ha cambiado su valor, saco su valor con un alert y asigno su valor al input con jQuery val().

Como veis los ejemplos son bien sencillos, en el código fuente de la demo encontrareis el código de los 3 formularios.

Otra opción es usar el método jQuery click(), pero resultaría incómodo para el usuario y casi imposible validar el formulario, ya que el primer click en el select siempre sería para desplegar los diferentes valores del select.

comments powered by Disqus