Haga clic en el evento de opción

Question

¿cómo manejo los eventos para los elementos de opción?

<select> 
     <option value='option1'>Gateway 1</option> 
     <option value='option2'>Gateway 2</option> 
     <option value='option3'>Gateway 3</option> 
</select> 

Cuando se hace clic en un elemento de opción, quiero mostrar una pequeña descripción del elemento. Alguna idea de como hacer eso?

Answer 1

Vas a querer utilizar jQuery's change event. Estoy mostrando el texto de su opción como una alerta, pero puede mostrar lo que quiera en función de sus necesidades. (Puede también, obviamente, lo puso dentro de otra parte de la página ... no tiene por qué ser una alerta.)

$('#myOptions').change(function() { 
    var val = $("#myOptions option:selected").text(); 
    alert(val); 
}); 

Además, nota, que he añadido una identificación para la etiqueta de modo select que puede manejar eventos más fácilmente (lo llamé myOptions).

Ejemplo: http://jsfiddle.net/S9WQv/

Answer 2

Según lo especificado por JasCav usando jQuery que puede lograr lo mismo en JavaScript utilizando

<select onchange="alert(this.options[this.selectedIndex].text);"> 
     <option value='option1'>Gateway 1</option> 
     <option value='option2'>Gateway 2</option> 
     <option value='option3'>Gateway 3</option> 
</select> 

Alternativamente, onclick caso de opción, pero tenga en cuenta que no es compatible con todos los navegadores.

<select> 
     <option value='option1' onclick="alert(this.value);" >Gateway 1</option> 
     <option value='option2'>Gateway 2</option> 
     <option value='option3'>Gateway 3</option> 
</select>