2011-05-17 9 views
6

Estoy tratando de hacer un menú desplegable directo para el safari móvil. Tengo esto funcionando al 100% en Safari, que muestra despliegues de estilo normal. Pero los menús desplegables de safari móvil tienen un botón 'siguiente'.'siguiente' en el menú desplegable de iPhone Safari no se activa en el evento de cambio

Al presionar este botón siguiente se accede al siguiente menú desplegable de la cascada que activa el cambio(), por lo que el siguiente menú desplegable está vacío.

El usuario se ve obligado a presionar 'listo' para activar el cambio, luego haga clic en el siguiente menú desplegable.

¿Alguien sabe una forma de evitar esto. ¿O qué evento DOM se desencadena por '' siguiente '' safari móvil?

+0

para notar (con fines de SEO también), la gente podría atribuyen esto para jquery o jquery Mobile u otras bibliotecas javascript, pero si esto sigue siendo un problema a partir de hoy (que es para nosotros), entonces sería bueno escuchar una solución. – iJames

+1

Una solución interesante a este problema es ** desactivar los botones siguiente y anterior **. Se ha proporcionado un intento de hacer esto aquí: http://stackoverflow.com/questions/7472465/disabling-previous-and-next-buttons-in-mobile-safari – iJames

+0

El complemento de [esta publicación] (http: //stackoverflow.com/questions/5960731/strange-behavior-of-select-dropdowns-onchange-js-event-when-using-next-on-m/7284325#7284325) funcionó para mí. Parece que está cargando la segunda lista tan pronto como selecciona el elemento en la primera lista en lugar de esperar hasta que el usuario pulse 'siguiente' o 'hecho' – Billy

Respuesta

0

Esa es una superposición nativa de iOS, por lo que lo que obtendrás es un evento de desenfoque cuando aparezca esa superposición. Intenta usar el evento blur y observa cómo funciona.

+0

Por lo que puedo ver, no es un dado. Intenté desenfocar e incluso centrarme en el segundo menú desplegable.En ambos casos, en iOS 5, la superposición parece capturar las opciones desplegables antes del evento de cambio/desenfoque/enfoque, por lo tanto, no permite que los desplegadores se actualicen y, por lo tanto, no permite que los tumblers de iOS se actualicen. Todavía esperando una solución. Vernon, ¿tienes alguna otra idea sobre esta superposición nativa de iOS? ¡Gracias! – iJames

+0

Me pregunto si posiblemente hay algo más en juego. Aquí hay un jsFiddle que configuré y probé en mi iPhone. http://jsfiddle.net/Wjbxt/1/ El evento de cambio se activa cuando hago clic en siguiente después de hacer una selección en el primer menú desplegable y actualiza el valor en la vista previa. Estoy en iOS 5, pruébalo y cuéntame qué obtienes. – vernonk

+0

Esta actualización (http://jsfiddle.net/Wjbxt/2/) antepone el valor seleccionado al segundo menú desplegable. Eso no ocurre de inmediato. Si voy anterior y luego regreso al segundo menú desplegable, el valor está allí. Simplemente no se recoge de inmediato. Definitivamente requiere más investigación. – vernonk

0

He intentado muchas soluciones directas para resolver este problema sin éxito. El segundo menú desplegable se rellena después de Aparece la superposición "asistente de formulario" de Safari Mobile con la ruleta (llamada "selector" en la documentación - http://developer.apple.com/library/ios/#DOCUMENTATION/UserExperience/Conceptual/MobileHIG/UIElementGuidelines/UIElementGuidelines.html). Entonces el selector está poblado con valores antiguos.

En otro caso, si el segundo menú desplegable en cascada está inactivo, el botón Siguiente del asistente de formulario salta sobre él. Sin embargo, en ese escenario, una vez que se coloca el siguiente elemento de formulario, el segundo menú desplegable se actualiza correctamente, por lo que tocar "anterior" en ese punto proporciona la lista correcta en el selector.

Mi "respuesta" es que Apple está sugiriendo que no se deben usar pulldowns basados ​​en JavaScript pero que se implementará otro UX aunque no he encontrado nada que describa esto aparte de los menús de paginación jQuery Mobile estándar.

2

Desactivar el segundo menú desplegable desde el principio es el único trabajo que he encontrado hasta ahora. deshabilitará el botón "siguiente" en iphones

Agregue el deshabilitado attr (disabled = "disabled") para seleccionar y usar javascript o jQuery para habilitar o deshabilitar.

aquí es el código de jQuery

$(".DD1").focus(function() { 
    $('.DD2').attr('disabled', 'disabled'); 
}).blur(function() { 
    $('.DD2').removeAttr('disabled'); 
}); 

aquí es un ejemplo vivo de que está haciendo esto

usando jQuery: http://www.imotors.com/mobile

Cuestiones relacionadas