javascript - touchend - ¿El evento JQuery Click no se desencadena en Safari?
touchstart jquery (2)
Intento hacer algo cuando un usuario selecciona una opción de un cuadro de selección: tan simple como puede ser ¿no? Estoy usando JQuery 1.3.1 para registrar un manejador de clics con el id del cuadro de selección. Todo estuvo bien hasta que probé usando Chrome y Safari y encontré que no funcionaba.
- Firefox 3.05 - SÍ
- IE 7.0.5730.13 - SÍ
- IE6Eolas - SÍ
- Sarafi 3.2.1 - NO
- Chrome 1.0.154.43 - NO
Vea el siguiente código:
<html>
<head>
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function(){
$(''#myoption'').click(function() { alert(''Select Dropdown was clicked: ''+ $(''#myoption'').val()); });
});
</script>
</head>
<body>
<select id="myoption">
<option value="A">A</option>
<option value="B">B</option>
</select>
</body>
</html>
¿Alguien sabe lo que debería hacer para que esto funcione? ¿La alerta eventualmente se dispara, pero solo después de hacer doble clic en el cuadro de selección?
Encontré mi problema Para cuadros de selección, necesita registrar un controlador para un evento de "cambio" en lugar de un evento de "clic". Es extraño que Firefox y IE funcionen con el evento click.
En resumen, el siguiente código funciona en todos los navegadores:
<html>
<head>
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function(){
$(''#myoption'').change(function() { alert(''Select Dropdown was clicked: ''+ $(''#myoption'').val()); });
});
</script>
</head>
<body>
<select id="myoption">
<option value="A">A</option>
<option value="B">B</option>
</select>
</body>
</html>
Safari y Chrome son navegadores basados en webkits. Webkit utiliza los elementos desplegables nativos de su sistema operativo en lugar de implementar los menús desplegables por sí solos, y desafortunadamente los menús desplegables nativos no admiten eventos de clic. Por la misma razón, tampoco son compatibles con CSS para elementos de opción u otros trucos aseados.
La única forma de navegador cruzado para que funcionen es implementando esto a mano usando un <ul> y un montón de javascript.