Sujet Précédent Sujet Suivant

JavaScrpt - CSS

Résolu/Fermé
lucvanbird - 23 avril 2008 à 16:57
dameginettedleville Messages postés 21 Date d'inscription mercredi 23 avril 2008 Statut Membre Dernière intervention 2 septembre 2010 - 23 avril 2008 à 20:11
Bonjour,

J'ai un évaluateur d'expression JS. J'aimerais simplement que le message d'erreur soit de couleur rouge. Cependant, je ne parviens pas à implanter du css dans mon code JS ci-dessous.

Merci beaucoup pour votre aide !!!


<body>
<form action="#" id="evalExpr">
<div id="message">
</div>
<p>
<label for="expr">Expression
<input type="text" name="exemple" id="expr" tabindex="1" />
</label>
</p>
<div id="piedForm">
<input type="submit" name="Envoyer"/>
<input type="reset" name="Annuler"/>
</div>
</form>


var msgInit;
window.onload = initialiser;

function initialiser() {
msgInit=document.getElementById("message").innerHTML; //sauvez msg initial
document.getElementById("evalExpr").onsubmit = evaluer; //e-e-r
document.getElementById("expr").onfocus = effacerRes;
document.getElementById("expr").focus(); // met le focus dans le champ
document.getElementById("evalExpr").reset; //remise à zéro du form à chaque reload
}

function evaluer() {
var res; var msg="Entrez une expression";
var entree = document.getElementById("expr").value; //saisir l'expressions dans le champ de saisie
if (entree !=""); //ok
res = eval(entree); //evaluer expr / si non vide
msg="L'expression " + entree + " vaut " + res + " (de type > \" " + typeof res + "\")";
document.getElementById("message").innerHTML=msg; //afficher dans la page
return false;
}

function effacerRes() {
document.getElementById("message").innerHTML=msgInit;
this.value="";

4 réponses

Réponse 1 / 4
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
23 avril 2008 à 17:03
salut,

avec : 
document.getElementById("message").style.color = '#F00';

et pour les autres propriétés CSS, en générale c'est identique, suffit de mettre une majuscule si il y a deux mots dans la propriété CSS : 
document.getElementById("message").style.backgroundColor = '#000';
2
lucvanbird
23 avril 2008 à 17:11
Merci beaucoup pour ta réponse rapide !

J'ai maintenant un autre problème. Quand l'utilisateur n'inscrit rien dans le champ, il est indiqué "L'expression vaut undefined (de type > " undefined")" Or je dois obtenir "Entez une expression!" et c'est ce message qui doit figurer en rouge.
0
Réponse 2 / 4
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
23 avril 2008 à 18:22
formate et indente ton code, tu trouveras plus facilement les erreurs.
il y avait un point-virgule au bout du 'if()' et l'accolade de la fonction était pas fermée.
pour formater le code sur le forum, c'est avec ce bouton. 
function evaluer()
{
	var res;
	var msg="Entrez une expression";
	var entree = document.getElementById( "expr" ).value;
	if( entree.length > 0 )
	{
		res = eval( entree );
		msg="L'expression " + entree + " vaut " + res + " (de type > \" " + typeof res + "\")";
		document.getElementById( "message" ).innerHTML=msg; 
		return false;
	}
	else
	{
		document.getElementById( "message" ).innerHTML=msgInit;
		document.getElementById( "message" ).style.color = '#F00';
	}
}
2
dameginettedleville Messages postés 21 Date d'inscription mercredi 23 avril 2008 Statut Membre Dernière intervention 2 septembre 2010 1
23 avril 2008 à 20:11
J'ai bien suivi tes précieux conseils. ça marche !

encore merci !
0
Réponse 3 / 4
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
23 avril 2008 à 17:42 
if (entree.length > 0); // <--  MODIF 
res = eval(entree); //evaluer expr / si non vide
msg="L'expression " + entree + " vaut " + res + " (de type > \" " + typeof res + "\")";
document.getElementById("message").innerHTML=msg; //afficher dans la page
return false;
}
else
{
document.getElementById("message").innerHTML='Entrez une valeur';
}
0
dameginettedleville Messages postés 21 Date d'inscription mercredi 23 avril 2008 Statut Membre Dernière intervention 2 septembre 2010 1
23 avril 2008 à 17:58
ça ne fonctionne plus. Le validateur m'indique une erreur au niveau du "else".
0
Réponse 4 / 4
Dalida Messages postés 6728 Date d'inscription mardi 14 mai 2002 Statut Contributeur Dernière intervention 11 janvier 2016 921
23 avril 2008 à 18:00
l'accolade du 'if()' est pas ouverte… 
if (entree.length > 0)
{
res = eval(entree); //evaluer expr / si non vide
msg="L'expression " + entree + " vaut " + res + " (de type > \" " + typeof res + "\")";
document.getElementById("message").innerHTML=msg; //afficher dans la page
return false;
}
else
{
document.getElementById("message").innerHTML='Entrez une valeur';
}
0
dameginettedleville Messages postés 21 Date d'inscription mercredi 23 avril 2008 Statut Membre Dernière intervention 2 septembre 2010 1
23 avril 2008 à 18:08
malheureusement il n'y a toujours rien..

voici toujours un nouvelle copie, si tu as le courage....

var msgInit;
window.onload = initialiser;

function initialiser() {
msgInit=document.getElementById("message").innerHTML; //sauvez msg initial
document.getElementById("evalExpr").onsubmit = evaluer; //e-e-r
document.getElementById("expr").onfocus = effacerRes;
document.getElementById("expr").focus(); // met le focus dans le champ
document.getElementById("evalExpr").reset; //remise à zéro du form à chaque reload
}

function evaluer() {
var res; var msg="Entrez une expression";
var entree = document.getElementById("expr").value; //saisir l'expressions dans le champ de saisie
if (entree.length > 0); //* !=" "); //ok
{
res = eval(entree); //evaluer expr / si non vide
msg="L'expression " + entree + " vaut " + res + " (de type > \" " + typeof res + "\")";
document.getElementById("message").innerHTML=msg; //afficher dans la page
return false;
}
else
{
document.getElementById("message").innerHTML=msgInit;
document.getElementById("message").style.color = '#F00';
}

function effacerRes() {
document.getElementById("message").innerHTML=msgInit;
this.value="";
}
0

Discussions similaires

trait horizontal avec du css
tipi75 -
tipi75 -

8 réponses
Enlever le soulignement sous les liens en HTML/CSS
baissaoui -
baissaoui -

0 réponse
HTML - définir taille bouton
Diva -
Utilisateur anonyme -

14 réponses
[CSS] Forcé retour à la ligne
aKuma59 -
zigoss -

33 réponses
[CSS] Mettre un objet au premier plan
Achillion -
tiran58 -

2 réponses