Hola, aquí quiero mostrar una alternativa para deshabilitar el relleno automático y el autocompletar del navegador chrome en las pantallas de inicio de sesión.
Lo que se observa es que el navegador Chrome, desde hace algún tiempo, no ha respetado más el atributo autocompletar (autocomplete = off) en los elementos input.
Por eso decidí iniciar una búsqueda por algo que hiciera posible “eludir” esa configuración de Chrome, y después de una larga investigación en Internet y diversas pruebas, donde varias sugerencias no funcionan y otras hasta funcionan pero no eran adaptables al Scriptcase, ¡conseguí llegar a una opción ajustable!
La siguiente sugerencia inhibe la ventana flotante con las contraseñas guardadas, el relleno automático y el fondo amarillo de la ventana Login y Contraseña.
A continuación, imagen de una pantalla de inicio de sesión sin aplicación de la desactivación del autocomplete:
Vamos al código:
Para editar la aplicación por el IDE de Scriptcase, tenemos a la derecha la opción Javascript, justo debajo de SQL.
Seleccione el objeto: Form y el evento: onLoad, haga clic en editar y agregue el código siguiente:
$(':input').attr('autocomplete','off'); //agregando el atributo autocomplete con valor off a todos los elementos input.
$("#login_troca").val(''); //vaciando el valor del elemento input de id login_cambio.
$("#pswd_troca").val(''); //vaciando el valor del elemento input de id pswd_troca.
setTimeout(function(){ //iniciando un temporizador donde el siguiente código se ejecutará después de 500 milisegundos
$("#login_troca").css('display','none'); //ocultando el elemento de id login_troca
$("#pswd_troca").css('display','none'); ////ocultando el elemento de id pswd_troca
}, 500);
** No olvide guardar el código. **
Ahora vamos a los campos login y pswd (nombre de los campos sugeridos en este ejemplo).
En las propiedades del campo de login, colocaremos el siguiente valor para la propiedad Label del campo:
<input id="login_cambio" type="text" name="login" size="1" width="1" height="" autocomplete="off" style=" z-index: -1000; height: 1px; width: 1px; border: none; position:absolute; ">Login
Lo mismo para la etiqueta del campo pswd:
<input id="pswd_cambio" type="password" name="pswd" size="1" autocomplete="off" style="z-index: -1000; height: 1px; width: 1px; border: none; position: absolute; ">Senha
El atributo Style con sus propiedades y valores agregados inline son sólo para dejar el elemento de entrada lo menos perceptible posible.
Listo! Guarde y pruebe la aplicación.
Explicando:
Chrome asignó al primer elemento de name = “NAME” el auto-relleno. ¿Qué hemos hecho? Duplicamos el elemento de name = “NAME” y lo hacemos transparente y después de medio segundo de la carga de la página ocultamos ese campo. Esto engaña al navegador, haciendo que asigne el autocomplete al primer campo de name = “NAME” encontrado, no asignando el autocompletado al segundo elemento del mismo nombre.
Es una solución de contorno que alivia esta desagradable opción en las pantallas de login, dejando también la pantalla de login más ligera sin las ventanas con fondo amarillo con auto-relleno.
Bueno, esa fue una alternativa que descubrí para ‘resolver’ esa cuestión del autocomplete y auto-relleno automático en Chrome, ajustable a nuestro Scriptcase.
Espero que le sea útil así como fue para mí!
Ah! Pero una cosa, si usted todavía no conoce el Scriptcase, le invito a descargar y probar esta herramienta:
Vea este y muchos otros blogposts aquí: ScriptcaseBlog
También podría gustarte…