2011-07-18 14 views
5

Tengo una lista de selección simple que cuando hago clic en una de las opciones muestra la opción seleccionada en un mensaje. Todo funciona como se espera en IE y FF, pero no en Chrome. Aquí está mi HTML:jquery chrome seleccionar cambiar/hacer clic no funciona; funciona en IE/FF

<select id="selectlist" class="select_list" size="10" title="Choose an item to load"> 
    <option value="1">Item 1</option> 
    <option value="2">Item 2</option> 
    <option value="3">Item 3</option> 
    <option value="4">Item 4</option> 
    <option value="5">Item 5</option> 
</select> 

Y aquí está mi jQuery:

$(function(){ 
    $("#selectlist").click(function(event){ 
    alert("Click event on Select has occurred!"); 
    $("option:selected", $(this)).each(function(){ 
     ...more code here... 
    }); 
    }); 
}); 

En IE y FF las pantallas de alerta cada vez que se hace clic en una opción, pero no en Chrome. He usado .change en lugar de .click con exactamente los mismos resultados. Cualquier ayuda sería realmente apreciada.


¡ACTUALIZACIÓN!

Después de seguir investigando y probando, creo que el problema no está en la etiqueta select sino que está relacionada con el diálogo de jquery. Creé un caso de prueba en http://jsfiddle.net/chuckl/6Gh78/3/ que reproduce el problema. Haga clic en el botón Cargar para generar la ventana de diálogo. En FF puede hacer clic en un elemento de la lista y se seleccionará, se actualizará la etiqueta p y aparecerá un cuadro de alerta. En Chrome, todo lo que obtienes es el cuadro de alerta.

Respuesta

0

El código que tiene funciona bien para mí en la versión 14.0.814.0. Sin embargo, dado que lo que está diciendo es un error y no es realmente una pregunta, debería enviarlo al Chromium issue tracker.

0

Funciona bien para mí también (versión 12.0.742.122). Posibles problemas:

  1. Quizás tenga otro error en su secuencia de comandos, que impide que este se ejecute; compruebe la consola (Ctrl + Shift + J)

  2. ¿Dónde se ubica su secuencia de comandos en la página? Quizás el DOM aún no se haya inicializado cuando se ejecuta el script. En ese caso, trate de envolver en lugar de $(document).ready(function(){ ... })$(function(){ ... })

+0

Se Entiendo que '$ (function() {})' es idéntico a '$ (document) .ready (function() {...})'. También revisé la consola y no encontré errores. Estoy usando la misma versión (12.0.742.122.) – user686779

+0

¿El enlace jsFiddle * AlienWebguy * dejó de funcionar para usted? –

+0

Sí lo hace, que es lo que hace que esto sea tan confuso. Traté de mover el código para más tarde sin cambios. Cuando paso por el código con un depurador El código se ejecuta en la página de recarga pero nunca cuando hago clic en una opción. – user686779

0

intenta utilizar el método de la Prop. Lo probé en Safari, Opera, Firefox y Chrome, y funcionó bien.

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Test - Option selected - jQuery</title> 
</head> 
<body> 
    <form> 
     <select> 
     <option value="11">aa</option> 
     <option value="22">bb</option> 
     <option value="33">cc</option> 
     <option value="44">dd</option> 
     </select> 
    </form> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script> 
     $(function(){ 
      $('select option:last').prop('selected','selected'); 
     }); 
    </script> 
</body> 
</html> 

Puede encontrar más información aquí:

http://jquery.com/upgrade-guide/1.9/#attr-versus-prop-

0

He encontrado que los siguientes trabajó para mí - en lugar de usar el clic, el uso en el cambio por ejemplo:

jQuery('#elemen select').on('change', (function() { 

     //your code here 

})); 
Cuestiones relacionadas