Bonsoir à tous,
Je débute en Javascript et je suis face à un problème qui me scie l'esprit en deux: comment désabonner un événement? :/
En fait je veux que des que la largeur de "element" est supérieure à 500px, l'événement qui lui est associé est désabonné. Je sais qu'il faut utiliser removeEventListener(); mais je dois probablement mal l'utiliser, j'ai fais des recherches mais je tombe sur des choses assez complexes c'est pourquoi je viens chercher votre aide. Merci beaucoup d'avance
Voici le
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>eclipse</title> <meta charset="UTF-8"/> <link href="style/style-exo5.css" type="text/css" rel="stylesheet" /> <script src="scripts/exo5.js"></script> </head> <!-- corps du document --> <body> <h1>premiers événements : eclipse</h1> <div id="doc"> <div id="buttons"> <button id="plus">+</button> <button id="moins">-</button> </div> <img id="sun" src="../images/soleil.jpg" alt="soleil" /> </div> </body> </html>
Voici le
Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30 var setUpListeners = function() { var bouton_plus = document.getElementById("plus"); var bouton_moins = document.getElementById("moins"); var element = document.getElementById("sun"); bouton_plus.addEventListener("click", agrandir); bouton_moins.addEventListener("click", retrecir); if (element.width > 500) { bouton_plus.removeEventListener("click", agrandir); } } window.addEventListener("load", setUpListeners); var agrandir = function() { /* fonction qui sert à agrandir la largeur de element de 20px */ var element = document.getElementById("sun"); element.style.width = (element.width + 20).toString() + 'px'; } var retrecir = function() { /* fonction qui sert à rétrécir la largeur de element de 20 px*/ var element = document.getElementById("sun"); element.style.width = (element.width - 20).toString() + 'px'; }
Partager