J'ai trouvé une solution complète à cette question. (J'ai testé cela dans Chrome 27 et Firefox 21).
Il y a deux choses à savoir:
- Déclenchez 'Enregistrer le mot de passe', et
- Restaurer le nom d'utilisateur / mot de passe enregistré
1. Déclenchez "Enregistrer le mot de passe":
Pour Firefox 21 , «Enregistrer le mot de passe» est déclenché lorsqu'il détecte qu'il existe un formulaire contenant un champ de texte d'entrée et un champ de mot de passe d'entrée est soumis. Donc nous avons juste besoin d'utiliser
$('#loginButton').click(someFunctionForLogin);
$('#loginForm').submit(function(event){event.preventDefault();});
someFunctionForLogin()
effectue la connexion ajax et recharge / redirige vers la page de connexion tout en event.preventDefault()
bloquant la redirection d'origine en raison de la soumission du formulaire.
Si vous utilisez uniquement Firefox, la solution ci-dessus est suffisante mais elle ne fonctionne pas dans Chrome 27. Ensuite, vous demanderez comment déclencher «Enregistrer le mot de passe» dans Chrome 27.
Pour Chrome 27 , "Enregistrer le mot de passe" est déclenché après avoir été redirigé vers la page en soumettant le formulaire qui contient un champ de texte de saisie avec l'attribut name = "username" et le champ de saisie du mot de passe avec l'attribut name = "password" . Par conséquent, nous ne pouvons pas bloquer la redirection en raison de la soumission du formulaire, mais nous pouvons effectuer la redirection après avoir effectué la connexion ajax. (Si vous voulez que la connexion ajax ne recharge pas la page ou ne redirige pas vers une page, malheureusement, ma solution ne fonctionne pas.) Ensuite, nous pouvons utiliser
<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>
Le bouton avec type = 'button' fera que le formulaire ne sera pas soumis lorsque le bouton sera cliqué. Ensuite, lier une fonction au bouton pour la connexion ajax. Enfin, l'appel $('#loginForm').submit();
redirige vers la page de connexion. Si la page de connexion est la page actuelle, vous pouvez remplacer «signedIn.xxx» par la page actuelle pour effectuer la «régénération».
Maintenant, vous constaterez que la méthode pour Chrome 27 fonctionne également dans Firefox 21. Il vaut donc mieux l'utiliser.
2. Restaurez le nom d'utilisateur / mot de passe enregistré:
Si vous avez déjà le loginForm codé en dur au format HTML, vous ne trouverez aucun problème pour restaurer le mot de passe enregistré dans le loginForm.
Cependant, le nom d'utilisateur / mot de passe enregistré ne sera pas lié au loginForm si vous utilisez js / jquery pour créer le loginForm dynamiquement, car le nom d'utilisateur / mot de passe enregistré est lié uniquement lorsque le document se charge.
Par conséquent, vous deviez coder en dur le loginForm au format HTML et utiliser js / jquery pour déplacer / afficher / masquer le loginForm dynamiquement.
Remarque:
Si vous faites la connexion ajax, n'ajoutez pas autocomplete='off'
de formulaire de balise comme
<form id='loginForm' action='signedIn.xxx' autocomplete='off'>
autocomplete='off'
fera échouer la restauration du nom d'utilisateur / mot de passe dans le loginForm car vous ne l'autorisez pas à «compléter automatiquement» le nom d'utilisateur / mot de passe.