évènement qui ne se déclenche pas ?

Fermé

charline159 Messages postés 208 Date d'inscription lundi 14 août 2017 Statut Membre Dernière intervention 22 juin 2022 - Modifié le 6 févr. 2021 à 23:18
charline159 Messages postés 208 Date d'inscription lundi 14 août 2017 Statut Membre Dernière intervention 22 juin 2022 - 7 févr. 2021 à 00:30

Bonjour! J'ai codé un petit carré en html/css, et avec du JS j'aimerais faire en sorte qu'il change de couleur lorsqu'on clique dessus. Cependant, cela ne marche pas et la couleur reste la même...

Pourriez-vous me dire où je me suis trompée?

Jsfiddle (le lien ici: https://jsfiddle.net/emhn58z0/2/ ) me donne l'erreur suivante:

document.getElementById("squareRandomColor").addEventListener("click", getRandomColor());
TypeError: EventTarget.addEventListener: Argument 2 is not an object."

Cependant, je ne comprends pas, étant donné que j'ai déjà indiqué l'objet concerné (avec l'id squareRandomColor).

<!DOCTYPE html>
<html>

 <head>
  <title>Site projet</title>  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
    <link rel="stylesheet" href="page3style.css" />    
 </head>
  
  <body>
    <div id="squareRandomColor"></div>
    <script src="page3fonctions.js"></script>    
  </body>

</html>

body{
 margin: 100px;
}

#squareRandomColor{
 width: 100px;
 height: 100px;
 position: relative;
 top: 100px;
 background-color: black;
}

function getRandomColor(){
 return "#"+Math.floor(Math.random()*16777215).toString(16);
}

document.getElementById("squareRandomColor").addEventListener("click", getRandomColor());

Où ai-je donc fait une erreur ?

Cordialement

A voir également:

évènement qui ne se déclenche pas ?
Évènement facebook disparu - Forum Facebook
Evenement 410 kernel pnp ✓ - Forum Windows 10
Un evenement inattendu s'est produit league of legends - Forum Jeux PC
Mon repondeur free mobile ne se declenche pas - Forum Free mobile
Ma messagerie vocale ne s'active plus ??? - Forum Free mobile

2 réponses

Réponse 1 / 2

jordane45 Messages postés 38173 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 10 mai 2024 4 665
6 févr. 2021 à 23:34

Bonjour,

Tu as des parenthèses en trop

document.getElementById("squareRandomColor").addEventListener("click", getRandomColor);

Ou encore (c'est ce que j'utilise )


document.getElementById("squareRandomColor").addEventListener("click", function(){
     getRandomColor();
});

pour ce qui est du changement de couleur.. ta fonction, pour l'instant génère un code hexa aléatoire.. mais tu ne l'utilises pas...


document.getElementById("squareRandomColor").addEventListener("click", function(){
    this.style.backgroundColor = getRandomColor();
});

Réponse 2 / 2

charline159 Messages postés 208 Date d'inscription lundi 14 août 2017 Statut Membre Dernière intervention 22 juin 2022 1
7 févr. 2021 à 00:30

effectivement, ça marche à présent, merci à toi !

Par contre, j'ai un autre soucis: j'ai essayé d'utiliser ma fonction en la déclarant avant de l'utiliser, cependant ça ne fonctionne pas.

function getRandomColor(){
	return "#"+Math.floor(Math.random()*16777215).toString(16);
}

function setRandomColor(){
	return this.style.background = getRandomColor();
}

document.getElementById("squareRandomColor").addEventListener("click", setRandomColor());

Discussions similaires

La messagerie vocale ne se déclenche pas.

nvlddmkm l'éternel problème.

Brouillon événement facebook

Compteur d'événement de haute précision

Paiement Leboncoin

Discussions similaires

Newsletters