11486 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Mettre de la couleur au resultat javascript

bonjour ,bonsoir
je fais un qcm voici une partie du script
je souhaite mettre le résultat en couleur ,je début en javascript

function modifierText(id, texte) {
document.getElementById(id).innerHTML = texte;
}

function tester(f) {
var toutVaOk = true;

if (f.choix[0].checked) {
modifierText("resultat", "Bonne réponse:bla bla bla");

j'ai fait pas mal de recherche et d'essais je suis passé au css
je ne trouve pas l'erreur
merci d"avance pour votre aide
#resultat, Bonne reponse{
color: green;
}

#resultat, Mauvaise reponse{
color: red;
}
les reponses reste en rouge bonne ou mauvaise
Modifié par benabar (01 May 2017 - 10:27)
Hello,
je n'ai pas tout compris, mais si :

#resultat, Bonne reponse{
color: green;
}

est sensé être une déclaration CSS, rien ne va plus !
Et le reste à l'avenant
Quel est l'objectif exactement ?qu'est-ce qui doit se passer et quand ?
Peut-on voir le code, HTML, JS et CSS ? uniquement pour une question du QCM bien entendu
Bonsoir, a vrai dire je ne comprend pas ton problème mais bon si je peut me permettre de spéculer, je dirais:

En supposant que tu as un bloc où tes résultats sont affichés (<div id="résultat"></div>) tu pourra avoir un truc du genre

if (f.choix[0].checked) {
   modifierText("resultat", "Bonne réponse:bla bla bla");
   document.getElementById("resultat").style.color="green";
} else {
  modifierText("resultat", " Mauvaise réponse... ");
   document. getElementById("resultat").style.color="red":
}
réponse avec un peu de retard
Dimtrovich merci POUR TA SOLUTION ça marche BIEN

je me permets de te poser une question
je souhaiterai remplacer les check par des text ou textarea

c'est possible?????????????????

Cordialement
Bien-sûr que c'est possible mais le traitement sera un tout petit peu long.


<div id="resultat"></div>
<p>
   <label for="reponse">Quelle est la capitale du Cameroun</label>
    <input type="text" id="reponse" />
</p>

......

var reponse = document.getElementById('reponse').value;
if(reponse == 'Yaoundé'){
   modifierText("resultat", "Bonne réponse:bla bla bla");
   document.getElementById("resultat").style.color="green";
} else {
  modifierText("resultat", " Mauvaise réponse... ");
   document. getElementById("resultat").style.color="red":
}


Il faudra également penser à gérer la casse ( reponse.toLowerCase() par exemple ) pour que ton code ne distingue pas les majuscules/minuscules sinon quand on écrira YAOUNDÉ (au lieu de yaoundé) sa sera considérer comme une réponse fausse.
Modifié par Dimtrovich (19 May 2017 - 19:31)
bonjour bonsoir

j'ai essayé ,

mis le html dans form

<form name="QCM">

<div id="resultat"></div>
<p>
<label for="reponse">Quelle est la capitale du Cameroun</label>
<input type="text" id="reponse" />

</p>


<INPUT align=CENTER type="button" value="Valider" onclick="tester(this.form)"/>
<input type="reset" value="Effacer puis touche F5" >
</form>



et le javascript
<script type="text/javascript">

var reponse = document.getElementById('reponse').value;
if(reponse == 'Yaoundé'){
modifierText("resultat", "Bonne réponse:bla bla bla");
document.getElementById("resultat").style.color="green";
} else {
modifierText("resultat", " Mauvaise réponse... ");
document. getElementById("resultat").style.color="red":
}

</script>

mais rien ne se passe!!!!!!!!!!
j'ai du faire une erreur quelque par ,mais ou ????
JE DEBUT EN JAVASCRIPT
SI tu peux m'expliqué

CORDIALEMENT
Euh !! J'ai oublié un petit truc Smiley cligne

Au HTML, ajoute

<input type="button" value="Valider" onclick="verifier();" />

Et dans le JS, créé une fonction ( verifier() ) où tu mettra le Code précédant

function verifier(){
   /* colle le code précédant ici */
}
Euh !! J'ai oublié un petit truc Smiley cligne

Au HTML, ajoute

<input type="button" value="Valider" onclick="verifier();" />

Et dans le JS, créé une fonction ( verifier() ) où tu mettra le Code précédant

function verifier(){
   /* colle le code précédant ici */
}
Sujet clos
Aller à