Bonsoir j'envoie ce petit message pour vous demander un peu d'aide. Pour le contexte, je suis en train de travailler sur un captcha en image comme reCaptcha mais le souci c'est que j'ai une fonction clicked en javascript pour selectionner une cellule de mon tableau ce que j'aimerai faire c'est, au moment où un utilisateur va cliquer sur une cellule on va un effet de selection qui va etre enregistrer (surbrillance ou bien "enfoncement" de l'image) comme sur le captcha de Google en exemple 

Html: 

 <div class="card border-0">
                        <table width="465" border="0" cellspacing="0" cellpadding="0" height="465">
                            <tr>
                              <td id="i1" class="i1" value="TOP-LEFT"></td>
                              <td id="i2" class="i2" value="TOP-CENTER"></td>
                              <td id="i3" class="i3" value="TOP-LEFT"></td>
                            </tr>
                            <tr>
                              <td id="i4" class="i4" value="CENTER-LEFT"></td>
                              <td id="i5" class="i5" value="CENTER-CENTER"></td>
                              <td id="i6" class="i6" value="CENTER-RIGHT"></td>
                            </tr>
                            <tr>
                              <td id="i7" class="i7" value="BOTTOM-LEFT"></td>
                              <td id="i8" class="i8" value="BOTTOM-CENTER"></td>
                              <td id="i9" class="i9" value="BOTTOM-RIGHT"></td>
                            </tr>
                        </table>
                    </div>

et le code javascript

function tes(event) {
  if (event.target.nodeName == "TD") {
    alert('TD got clicked');
  }
}

-
Edité par KemokobaBAYO1 6 avril 2021 à 18:30:09

Bonsoir, votre HTML est faux, pas valide, passer votre code au validateur pour voir et corriger vos erreurs => https://validator.w3.org/

L'attribut value n'existe pas pour la balise <td>, c'est pour les éléments de formulaire. Si vous avez besoin de passer une donnée dans un attribut utilisez l'attribut data-*

https://developer.mozilla.org/fr/docs/Learn/HTML/Howto/Use_data_attributes

Pourquoi un tableau? Les tableaux sont prévu pour des données tabulaire. Ici ce n'est pas le cas. Pas de tableau pour de la mise en page.

Pour pouvoir lancer une fonction sur un évènement (click par exemple) intéressez vous ou écouteur d'évènement.

https://developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener

Tout d'abord, merci pour votre réponse. Concernant les value pour balises <td> je ferais les changements nécessaire avec les data. Ensuite un tableau, car le tableau correspond à des images comme je l'ai dit, je travaille sur un captcha forcement il faut un tableau pour y afficher les images. 

En effet j'avais continué à avancer sur le code JS j'avance un petit, je vous montre 

function tes(event) {
            if (event.target.nodeName == "TD") {
                event.target.classList.toggle("clicked")
            }
        }

Maintenant il faut que je m'attaque à une fonction pour valider les td.clicked je pensais le faire comme ca : 

var selected = document.querySelectorAll('td.selected')
      for(var i=0; i< selected.length; i++){
      	var selec = selected[i];
          selec.addEventListener('click', function(event){
          	if(selected.length == 0){
          		var confirmation = "Vous n'avez pas choisi de de réponse.";
          		alert(confirmation);
          	}
          	else{
          		confirmation = selected[i].children[0].innerHTML
          	}
          });
      }

Qu'en pensez vous

-
Edité par KemokobaBAYO1 7 avril 2021 à 3:40:25

Tu te compliques énormément la vie pour arriver à pire qu'en utilisant les API natives. Regarde https://jsfiddle.net/qrx3ypzw/ : même pas besoin de JavaScript.

Ah mais il me semblait qu’il fallait utiliser du js pour faire celà car ce que je veux c’est envoyer les ima sélectionnées  en bases de données. d’où mon entêtement pour le faire en Js peut tu m’oriente pour faire ça ? 

en tout cas merci pour ta réponse  

Les id de tes images sont censés être la valeur de l'attribut value des checkboxes. Quand tu soumets le formulaire le serveur recevra les ids des images sélectionnées.

En règle générale documente toi sur les technologies du web avant de dégainer JavaScript. Si on peut faire sans alors c'est très probablement mieux.