Cuando creamos combos en un formulario nos puede aparecer la necesidad de detectar cuándo el usuario ha cambiado un valor del combo y saber que valor se ha seleccionado. Lo que en HTML viene a ser el evento onChange.
Pero, lo primero, creemos el formulario con el combo:
Ahora vamos a inyectar el código jQuery para el control de cambios en el combo de forma no intrusiva. Para ello creamos código jQuery en la cabecera de la página.
El método jQuery que nos permite controlar los cambios en un combo es .change(). Aplicaremos el método .change() sobre el elemento que representa al combo (el del id «combo»)
$("#combo").change(...);
En el manejador que asignamos al evento change buscaremos el nuevo valor que tenga el combo. Para ello nos vamos a valer de selectores. En concreto del «option:selected».
"#combo option:selected"
Si bien, para obtener el valor del elemento utilizamos la función .val().
Ya solo nos queda mostrar el nuevo valor del elemento tras los cambios en el combo. Por ejemplo, volvaremos dicho valor en una capa ayudándonos del método .html()
El código jQuery final nos quedará de la siguiente forma:
