javascript - validar - ¿Cómo enfoco un campo de texto HTML en un iPhone(haciendo que se levante el teclado)?

password html

Question

Estoy escribiendo una aplicación web para iPhone, y quiero enfocar automáticamente un campo de texto cuando se carga la página, abriendo el teclado. El Javascript habitual:

input.focus();

no parece estar funcionando ¿Algunas ideas?

Answer 1

Edición: lo siguiente ya no funciona en iOS : UIWebView permitió el enfoque automático y los enlaces de la pantalla de inicio utilizados para el enfoque automático, pero deshabilitaron muchas versiones anteriores.

La propiedad de autofocus (ver más abajo) no funciona desde una URL en Mobile Safari pero sí funciona si usted es:

1. utilizando un UIWebView
2. usando un enlace de pantalla de inicio

El tamaño de fuente de la entrada debe ser lo suficientemente grande para evitar el zoom iOS10 en el doble toque (ahora que la ventana gráfica siempre tiene zoom) y diseñar la página para que se ajuste a la pantalla (de lo contrario, en la carga de la página obtendrás una sincronización extraña) / errores de carrera en el zoom, o si es desplazable, el campo a veces no se centra correctamente en la pantalla).

autofocus : la especificación HTML5 para hacer esto es la propiedad de enfoque automático de la etiqueta de entrada . Pero iOS ignora eso, probablemente para una interfaz de usuario más limpia que no abre el teclado táctil cuando se navega a una página. Here hay una página que muestra la propiedad de enfoque automático. Antes de HTML5, debería llamar a element.focus () en el evento window.onload. Sin embargo, las llamadas focus () no son compatibles con iOS, excepto durante el controlador de un evento onclick.

Answer 2

Este es un trabajo:

setTimeout(function(){
    input.focus();
},500);//milliseconds

Answer 3

Si está configurando el foco con un evento de clic, debe evitar Prevención por defecto, de lo contrario, la acción predeterminada de los eventos de clic establecerá el foco en el elemento seleccionado.

Answer 4

Solo mostrará el teclado si dispara el foco desde un evento de clic, así que ponga un botón en la página con un clic que haga el foco y mostrará el teclado. Totalmente inútil, excepto para la validación (al hacer clic en el código de validación de envío se enfoca en un elemento no válido)

Answer 5

Tal vez un poco tarde, pero tal vez para una futura persona. En nuestra aplicación web que se ejecuta en iOS iPad (6 y más reciente), lo hacemos con un intervalo establecido:

startFocusOnTextField: function() {
        this.intervalIDForTextFieldFocus = window.setInterval(function() {
            document.getElementById(page.textInputFieldObj.id).focus();
        }, 150);
    },

Que se llama en carga de página (entorno móvil jQuery)

Answer 6

Tengo un problema similar, solo mi problema es que el enfoque no se producirá en un evento de "toque".

http://jsfiddle.net/milosdakic/FNVm5/

El siguiente código funcionará en Chrome / Safari, etc., pero fallará en Mobile Safari. La única manera de hacer que funcione es hacer que el evento sea ''clic'', pero dado que el código está creado para un dispositivo iOS, se beneficiaría si funcionara con eventos táctiles.

Parece ser un error con el motor de Webkit.

Answer 7

Nota : esta respuesta es antigua y puede que no sea relevante para las versiones más nuevas que existen ...

No es una ayuda para usted, pero el último póster de this hilo escribió que es un error del motor de webkit.
No puedo decir si es un error verificado o no ...

Último mensaje de Way Back Machine (como el original parece no funcionar):

Estoy desarrollando mi aplicación en XHTML MP / Ecmascript MP / WCSS puro. Por lo tanto, usar la plataforma nativa para controlar el api no es una opción para mí. Sí, el comportamiento que mencionas es el mismo que el mío. Busqué su tema en el bugzilla en webkit.org y encontré que este es un error reportado. enfocar () en un cuadro de texto resalta el elemento pero no proporciona un quilate para que el usuario comience a ingresar texto. Usar un temporizador como lo menciona "[email protected]" tampoco ayuda.

Este comportamiento es común en todas las plataformas (s60, iphone, android) que utilizan el motor webkit.

Así que a partir de ahora no veo una solución a este problema.

Espero que esto ayude