DevZone – Zone de développement web

Les éléments de formulaire de type « password » ont cette particularité de ne pas afficher les lettres saisies par l’utilisateur.

Outre le débat faut-il ou ne faut-il pas afficher en toutes lettres ce qui est tappé dans ce champs « Mot de passe », l’iphone a apporté une solution différente en affichant temporairement en clair le dernier caractère saisie.

Le plugin jQuery dPassword (pour delayed password) aussi appelé « iphone-like password », vous permet donc de modifier le comportement d’un champ « password ».

L’effet est donc le même que pour les détenteurs des  iphones, le dernier caractère saisie sera afficher en clair durant quelques secondes.

La mise en place de ce plugin est simple.

Vous avez besoin :

• du framework jQuery,
• du plugin dPassword,
• d’une initialisation du plugin pour vos champs password.

Ce qui donne :

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.dPassword.js"></script>
<script type="text/javascript">
    $(document).ready( function() {
        $('input:password').dPassword();
    });
</script>

La durée de visibilité du dernier caractère est modifiable en passant celle-ci en parmamètre de la fonction dPassword().

Démo et téléchargement du plugin sur le site officiel.

Lien :

• Iphone-like password fields using jQuery