Changer couleur texte Javascript
Résolu
crapoulou
Messages postés
28195
Date d'inscription
Statut
Modérateur, Contributeur sécurité
Dernière intervention
-
crapoulou Messages postés 28195 Date d'inscription Statut Modérateur, Contributeur sécurité Dernière intervention -
crapoulou Messages postés 28195 Date d'inscription Statut Modérateur, Contributeur sécurité Dernière intervention -
Bonjour,
J'ai un formulaire avec certaines zones de texte de préremplies de la notion de "Champ obligatoire" en gris (qui s'efface lorsque l'on clique dessus pour mettre son texte : Javascript).
Code CSS pour mettre en gris :
Je désirerai mettre le texte en noir lorsque le texte est différent de 'Champ obligatoire'. Je pense qu'il faut passer par du Javascript.
Exemple de code d'une zone de texte :
Merci d'avance.
--
T'as un problème ? Passe sur CCM!
Il n'y a pas de problème sans solution.
J'ai un formulaire avec certaines zones de texte de préremplies de la notion de "Champ obligatoire" en gris (qui s'efface lorsque l'on clique dessus pour mettre son texte : Javascript).
Code CSS pour mettre en gris :
form input{
color:grey;
}
Je désirerai mettre le texte en noir lorsque le texte est différent de 'Champ obligatoire'. Je pense qu'il faut passer par du Javascript.
Exemple de code d'une zone de texte :
<label for="mail">Adresse mail</label>
<input type="text" name="mail" id="mail" value='Champ obligatoire' onfocus="if(this.value=='Champ obligatoire'){this.value='';}" onblur="if(this.value==''){this.value='Champ obligatoire';}" />
Merci d'avance.
--
T'as un problème ? Passe sur CCM!
Il n'y a pas de problème sans solution.
A voir également:
- Javascript changer couleur texte
- Changer dns - Guide
- Excel cellule couleur si condition texte - Guide
- Changer la couleur de la barre des taches - Guide
- Changer carte graphique - Guide
- Transcription audio en texte word gratuit - Guide
3 réponses
tu mets une classe a tes input
class="obligatoire"
class="facultatif"
et dans ton css:
.obligatoire{
color: grey;
}
.facultatif{
color:black;
}
class="obligatoire"
class="facultatif"
et dans ton css:
.obligatoire{
color: grey;
}
.facultatif{
color:black;
}
Ha ok
<label for="mail">Adresse mail</label>
<input type="text" name="mail" id="mail" value='Champ obligatoire' onfocus="if(this.value=='Champ obligatoire'){this.value='';this.style.color="black"}" onblur="if(this.value==''){this.value='Champ obligatoire';}" />
Un petit exemple : http://paste.pocoo.org/show/207096/
Salut avion !
Je ne sais pas si ton pastebin reste longtemps hébergé alors je vais le poster pour les suivants qui auraient ce souci à l'avenir :
*************
Néanmoins, cette partie peut-elle être mise dans la CSS ?
Il fallait donc en effet mettre des classes et changer le nom de la classe en Javascript si je comprends bien :
this.className = ''';
Merci beaucoup !
Je ne sais pas si ton pastebin reste longtemps hébergé alors je vais le poster pour les suivants qui auraient ce souci à l'avenir :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste</title>
<style type="text/css">
input[type="text"].champ_obligatoire {
color:grey;
font-style:italic;
}
</style>
</head>
<body>
<form action="form_action.asp">
<p>
<label for="nom">Nom :</label>
<input type="text" name="nom" id="nom" value="Champ obligatoire" class="champ_obligatoire"
onfocus="if(this.value == this.defaultValue){ this.value = ''; this.className = ''; }"
onblur="if(this.value == ''){ this.value = this.defaultValue; this.className = 'champ_obligatoire'; }"
/>
</p>
</form>
</body>
</html>
*************
Néanmoins, cette partie peut-elle être mise dans la CSS ?
<style type="text/css">
input[type="text"].champ_obligatoire {
color:grey;
font-style:italic;}
</style>
Il fallait donc en effet mettre des classes et changer le nom de la classe en Javascript si je comprends bien :
this.className = ''';
Merci beaucoup !
Merci de ta réponse.
Ce n'est pas tout à fait l'effet désiré.
Je voudrais que le texte "Champ obligatoire" soit gris et quand l'utilisateur rentre son propre texte, il écrive en noir.