Encontré una solución completa para esta pregunta. (He probado esto en Chrome 27 y Firefox 21).
Hay dos cosas que debes saber:
- Desencadenar 'Guardar contraseña' y
- Restaurar el nombre de usuario / contraseña guardado
1. Activar 'Guardar contraseña':
Para Firefox 21 , 'Guardar contraseña' se activa cuando detecta que hay un formulario que contiene el campo de texto de entrada y se envía el campo de contraseña de entrada. Entonces solo necesitamos usar
$('#loginButton').click(someFunctionForLogin);
$('#loginForm').submit(function(event){event.preventDefault();});
someFunctionForLogin()
hace el inicio de sesión ajax y vuelve a cargar / redirigir a la página de inicio de sesión mientras event.preventDefault()
bloquea la redirección original debido al envío del formulario.
Si solo trabajas con Firefox, la solución anterior es suficiente pero no funciona en Chrome 27. Luego preguntarás cómo activar 'Guardar contraseña' en Chrome 27.
Para Chrome 27 , 'Guardar contraseña' se activa después de que se redirige a la página enviando el formulario que contiene el campo de texto de entrada con el nombre de atributo = 'nombre de usuario' y el campo de contraseña de entrada con el nombre de atributo = 'contraseña' . Por lo tanto, no podemos bloquear la redirección debido al envío del formulario, pero podemos realizar la redirección después de haber realizado el inicio de sesión ajax. (Si desea que el inicio de sesión ajax no vuelva a cargar la página o no redirija a una página, desafortunadamente, mi solución no funciona). Entonces, podemos usar
<form id='loginForm' action='signedIn.xxx' method='post'>
<input type='text' name='username'>
<input type='password' name='password'>
<button id='loginButton' type='button'>Login</button>
</form>
<script>
$('#loginButton').click(someFunctionForLogin);
function someFunctionForLogin(){
if(/*ajax login success*/) {
$('#loginForm').submit();
}
else {
//do something to show login fail(e.g. display fail messages)
}
}
</script>
El botón con type = 'button' hará que el formulario no se envíe al hacer clic en el botón. Luego, vincula una función al botón para iniciar sesión en ajax. Finalmente, la llamada $('#loginForm').submit();
redirige a la página de inicio de sesión. Si la página de inicio de sesión es la página actual, puede reemplazar 'firmadoIn.xxx' por la página actual para hacer la 'actualización'.
Ahora, encontrará que el método para Chrome 27 también funciona en Firefox 21. Por lo tanto, es mejor usarlo.
2. Restaure el nombre de usuario / contraseña guardado:
Si ya tiene el loginForm codificado como HTML, entonces no encontrará ningún problema para restaurar la contraseña guardada en el loginForm.
Sin embargo, el nombre de usuario / contraseña guardado no se vinculará al loginForm si usa js / jquery para hacer el loginForm dinámicamente, porque el nombre de usuario / contraseña guardado se vincula solo cuando se carga el documento.
Por lo tanto, debe codificar el loginForm como HTML y usar js / jquery para mover / mostrar / ocultar el loginForm dinámicamente.
Observación:
si hace el inicio de sesión ajax, no agregue autocomplete='off'
en forma de etiqueta como
<form id='loginForm' action='signedIn.xxx' autocomplete='off'>
autocomplete='off'
hará que el nombre de usuario / contraseña de restauración en el formulario de inicio de sesión falle porque no permite que 'autocomplete' el nombre de usuario / contraseña.