-
Edité par GermanyNic 5 octobre 2021 à 18:10:59

Salut.

Jquery complique l'affaire, à mon avis.

Soit ce div :

<div id=mots>
    <input type="text" id="Mot1" size="2" name="Mot1" class=rouge>
    <input type="text" id="Mot2" size="1" name="Mot2" class=vert>
</div>

Si tu veux vérifier que toute les classes des input sont 'vert' avant d'afficher un message tu peux boucler sur les inputs de ton div :

let nonrempli = false;
for(let input of document.getElementById('mots').querySelectorAll('input'))
    if(input.className == 'rouge') nonrempli = true;
if(nonrempli) alert('tout n’est pas rempli')
else alert('tout est rempli')

Bien sûr, il te faudra mettre tout ceci dans une fonction que tu appelleras lorsque nécessaire.

Domi65 a écrit:

-
Edité par GermanyNic 5 octobre 2021 à 18:11:20

Bonjour,

Sinon il y a les formulaires. Ca marche bien et c'est fait pour ça. 

Bonjour, on ne supprime pas ses messages après avoir reçu de l'aide. 

Je recopie pour archive le message d'origine et ferme ce sujet.

GermanyNic a écrit:

Bonjour ! Je suis nouveau en Javascript et je fais un projet appelé "N'oubliez pas les paroles de la musique". J'ai réussi à faire en sorte qu'il vérifie si le mot inséré est le bon, mais je voulais qu'il vérifie qu'une fois que toutes les cases sont vertes un bouton apparaît pour passer à une autre musique et compter les points que l'utilisateur a gagnés jusqu'à présent, mais je ne sais pas comment en javascript sélectionner toutes les cases et vérifier si elles sont vertes...

<form name="Form" action="#"  method="post" class="validation">
        <div>
          <input type="text" id="Mot1" size="2" name="Mot1">
          <input type="text" id="Mot2" size="1" name="Mot2">
          <input type="text" id="Mot3" size="4" name="Mot3">
          <input type="text" id="Mot4" size="6" name="Mot4">
          <input type="text" id="Mot5" size="1" name="Mot5">
          <input type="text" id="Mot6" size="1" name="Mot6"><br><br>
          <input type="text" id="Mot7" size="8" name="Mot7">
          <input type="text" id="Mot8" size="1" name="Mot8">
          <input type="text" id="Mot9" size="3" name="Mot9">
        </div>
        <br>
 
        <div class="buttons">
          <button type="button" id="btn" class="button2">Valider ses paroles</button>
          <input type="reset" value="Recommencer" name="Reset" class="button3">
          <a href="#" class="ok">Next</a>
        </div>
      </form>
 
 
      <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
      <script>
$(document).ready(function(){
$("#btn").click(function(){
var str1 = $("#Mot1").val();
if (str1 == "Pour"){
  $("#Mot1").css('background', 'green');
}
else{
  $("#Mot1").css('background', 'red');
}
 
 
var str2 = $("#Mot2").val();
if (str2 == "être"){
  $("#Mot2").css('background', 'green');
}
else{
  $("#Mot2").css('background', 'red');
}