Extensions et tutorials gratuits disponibles sur internet pour Dreamweaver. PHP et ASP. Classement thématique. Blog référencé par Adobe Communauté Dreamweaver.

Dreamweaver gratuit

Javascript : pré-remplir un champ avec disparition au focus sur le champ

16 avril 2007 | Posté par caroder à 19:23

Bookmark and Share

Il est parfois très utile d'informer l'utilisateur de ce qu'il doit faire ou de ce qui lui est proposé de faire à l'intérieur même d'un champ de formulaire.

Les personnes un peu au fait de javascript connaissent les événements onFocus ou onClick associés à une valeur par défaut (en l'occurence ''). Cependant la difficulté vient du fait que le seul événement sus-nommés implique qu'à chaque nouveau focus ou clic de l'utilisateur le champ se vide quand bien même l'utilisateur a entré ses propres valeurs.

Ce problème est particulièrement pregnant dans le cas d'un textarea puisque les données peuvent être importantes.

Voici la solution du problème.

Pour un <textarea> :

<textarea name="mon_nom" cols="45" rows="8" id="mon_id" onFocus="if(this.value==this.defaultValue)value=''" onBlur="if(this.value=='')value=this.defaultValue;">Ici le texte que je veux faire apparaître</textarea>

Pour un input :

<input name="mon_nom" type="text" id="mon_id" onFocus="if(this.value==this.defaultValue)value=''" onBlur="if(this.value=='')value=this.defaultValue;" value="le texte que je veux faire apparaître" size="10" maxlength="200">

Catégorie : Divers | Commentaires [3] | Permalien [#]

Commentaires

  • onfFocus à remplacer par onFocus pour le input.

    Bon continuation.

    Posté par M@x | 11 mai 2008 à 16:48
  • Merci. Voilà qui est corrigé !

    Posté par dreamweaver | 12 mai 2008 à 19:43
  • un gros merci pour les scripts!

    Posté par vlaaD | 15 mai 2008 à 15:10
 

Poster un commentaire