Comment changer le texte d'un formulaire avec Jquery mais le conserver lorsqu'il est rempli par l'utilisateur?

Question

(J'espère que mon titre est compréhensible, il était difficile de résumer.)

J'ai un script qui modifie un texte dans un formulaire en fonction du bouton radio sélectionné comme vous pouvez le voir ici: http://jsbin.com/onowu/

Le problème est que si un utilisateur entre du texte puis clique sur un autre bouton radio, il enlèvera son texte.

Ce que je cherche est un moyen de changer le texte gris UNIQUEMENT quand il n'y a pas de texte rempli par l'utilisateur. Et si l'utilisateur supprime son texte, il remplira vide avec le texte en fonction du bouton radio sélectionné.

Vous pouvez voir mon code ici: http://jsbin.com/onowu/edit

Answer 1

Vérifiez si l'entrée a la classe « Hint ». Ne changez le texte que si c'est le cas.

Exemple complet:

$(document).ready(function() { 
    function setText(){ 
     var kf = this.title.split('|'); 
     if (kf.length < 0) return; 
     if($('#' + this.name + '_text').hasClass('hint')){ 
      $('#' + this.name + '_text').val(kf[0]).addClass('hint'); 
     } 
     $('#' + this.name + '_text').attr('title', kf[0]); 
    } 

    $("input[type='text']").inputdynvalue(); 
    $("input[type='radio']").click(setText); 
}); 

Cela fonctionne en vérifiant la zone de texte d'entrée pour la classe « indice » et changer la valeur que lorsqu'elle se trouve. Comme mentionné dans les commentaires par Jonathan Sampson "l'événement .focus() supprime la classe" indice ", et l'événement .blur() l'ajoute à nouveau si aucun texte n'a été fourni".

Je voudrais également exécuter votre code via le html validation service fourni par W3C. JavaScript peut être amusant si vous n'avez pas de code valide. (De plus tout le monde devrait écrire html valide)

A également remarqué que vous avez inclus jQuery deux fois dans votre code, je vous suggère de supprimer l'un d'entre eux.

---

Mis à jour (10 juillet 2009): Correction d'un bug mentionné dans les commentaires ci-dessous.