Formulaire d'espace réservé/filigrane et mots de passe enregistrés

Question

Je suis en train d'écrire un formulaire de connexion sur un site Web. Il est requis que le formulaire soit compact et que les étiquettes soient placées en tant que marques de réservation/filigranes dans les champs de courrier électronique et de mot de passe.

HTML5 introduit l'attribut d'espace réservé, mais il n'est pas très bien pris en charge. Par conséquent, j'ai examiné un certain nombre de plugins jQuery qui ajoutent des fonctionnalités d'espace réservé aux navigateurs qui ne le supportent pas nativement.

Mais ... aucun d'entre eux ne fonctionne vraiment avec les mots de passe sauvegardés par le navigateur.

Le problème se produit généralement lorsqu'un utilisateur a enregistré deux ou plusieurs noms d'utilisateur/mot de passe. Ensuite, lors de la sélection de l'une de leurs connexions, l'un des suivants se produit:

1) Le mot de passe est inséré derrière l'espace réservé, et l'espace réservé est toujours affiché. L'utilisateur peut alors penser que son mot de passe n'est pas entré.

2) Le mot de passe est inséré derrière l'espace réservé, et il affiche maintenant les points de mot de passe et un espace réservé les uns sur les autres. Confus et moche.

3) Le mot de passe est inséré sous forme de texte clair dans l'espace réservé, et est modifiable sous forme de texte clair (yargh!)

Pour autant que je peux voir, la cause du problème est qu'aucun événement est déclenché lorsque le navigateur insère les connexions enregistrées.

Est-ce que quelqu'un connaît un Javascript astucieux qui ne casse pas quand un utilisateur a enregistré plus d'un login?

Ou peut-il vraiment être vrai que personne n'a résolu ce problème? (hautement improbable)

Merci.

Answer 1

Je ne sais pas une solution pour un problème, mais peut-être vous pouvez l'éviter avec un petit truc:

http://jsfiddle.net/elektronikLexikon/tf3sC/

Placez les étiquettes derrière les entrées et afficher/les cacher.