Onclick à remplacer par addEventListener
Fermé
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
-
Modifié le 24 août 2017 à 23:16
moon136 Messages postés 71 Date d'inscription samedi 12 août 2017 Statut Membre Dernière intervention 17 avril 2018 - 26 août 2017 à 19:29
moon136 Messages postés 71 Date d'inscription samedi 12 août 2017 Statut Membre Dernière intervention 17 avril 2018 - 26 août 2017 à 19:29
A voir également:
- Onclick à remplacer par addEventListener
- Remplacer disque dur par ssd - Guide
- Remplacer par word - Guide
- Quel site pour remplacer coco - Accueil - Réseaux sociaux
- Remplacer tete sur photo - Guide
- Remplacer windows 7 par windows 10 - Accueil - Mise à jour
6 réponses
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
4 704
25 août 2017 à 02:48
25 août 2017 à 02:48
Bonjour,
Il faut mettre des ID à tes boutons ... puis tu pourras faire :
Un peu de lecture : https://developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener
.
Il faut mettre des ID à tes boutons ... puis tu pourras faire :
var el = document.getElementById("id_du_bouton"); el.addEventListener("click", action, false);
Un peu de lecture : https://developer.mozilla.org/fr/docs/Web/API/EventTarget/addEventListener
.
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
25 août 2017 à 15:29
25 août 2017 à 15:29
merci j'ai essayé d'appliquer mais ca ne marche pas:
en fait dans le document js je sais pas comment régler, si je dois supprimer quelque chose ou modifier,,?
merci de ton aide jordane
<form name="forsec"> <input type="text" size="3" name="secb" value="00"> <input type="text" size="3" name="seca" value="00"> <input type="text" size="3" name="secc"value ="00"> <input type="button" id="demarre" value="Start" /> <input type="button" id="pause" value="Pause" /> <input type="button" id="efface" value="clear" />
var centi=0 // initialise les dixièmes var secon=0 //initialise les secondes var minu=0 //initialise les minutes var demarre = document.getElementById('demarre').value; var pause = document.getElementById('pause').value; var efface = document.getElementById('efface').value; function chrono(){ centi++; //incrémentation des dixièmes de 1 if (centi>9){centi=0;secon++} //si les dixièmes > 9, //on les réinitialise à 0 et on incrémente les secondes de 1 if (secon>59){secon=0;minu++} //si les secondes > 59, //on les réinitialise à 0 et on incrémente les minutes de 1 document.forsec.secc.value=" "+centi //on affiche les dixièmes document.forsec.seca.value=" "+secon //on affiche les secondes document.forsec.secb.value=" "+minu //on affiche les minutes compte=setTimeout('chrono()',100) //la fonction est relancée //tous les 10° de secondes document.getElementById("demarre").action=true; } function rasee(){ //fonction qui remet les compteurs à 0 document.getElementById("demarre").action=false; centi=0; secon=0; minu=0; document.forsec.secc.value=" "+centi document.forsec.seca.value=" "+secon document.forsec.secb.value=" "+minu } function stop(){ clearTimeout(compte);//arrête la fonction chrono() document.getElementById("demarre").action=false; } window.addEventListener("load",function(){ document.getElementById('demarrer').addEventListener('click', chrono); document.getElementById('pause').addEventListener('click', stop); document.getElementById('efface').addEventListener('click', rasee); });
en fait dans le document js je sais pas comment régler, si je dois supprimer quelque chose ou modifier,,?
merci de ton aide jordane
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
>
Utilisateur anonyme
25 août 2017 à 15:43
25 août 2017 à 15:43
merci j'ai rectifier, maintenant dans la console j'ai l'erreur suivante :
TypeError: document.getElementById(...) is null[En savoir plus] script.js:6:15
ma var est fausse, ou je dois supprimer..?
TypeError: document.getElementById(...) is null[En savoir plus] script.js:6:15
var demarre = document.getElementById('demarre').value;
ma var est fausse, ou je dois supprimer..?
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
4 704
>
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
25 août 2017 à 15:48
25 août 2017 à 15:48
Déjà... à quel moment charges tu ton JS ?
Après le chargement de ta page ??
Sachant qu'il est fortement conseillé de placer tes JS ... a la fin de ton document.. juste avant le /body
car si tu l'as placé avant... normal que les getElementById ne fonctionnent pas... la page n'étant pas chargée et donc les éléments n'existant pas encore...
Après le chargement de ta page ??
Sachant qu'il est fortement conseillé de placer tes JS ... a la fin de ton document.. juste avant le /body
car si tu l'as placé avant... normal que les getElementById ne fonctionnent pas... la page n'étant pas chargée et donc les éléments n'existant pas encore...
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
>
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
25 août 2017 à 16:49
25 août 2017 à 16:49
Je le met ici au niveau du head enfin pour chacun de mes script je fais comme ca..
mais j'ai tester avnt le </body> mais ca marche pas non plus
<!DOCTYPE html PUBLIC> <html> <head> <meta charset="utf-8" /> <title>exercice11</title> <script src="script.js"></script> <link rel="stylesheet" type="text/css" href="docstyle.css" /> </head>
mais j'ai tester avnt le </body> mais ca marche pas non plus
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
25 août 2017 à 17:21
25 août 2017 à 17:21
Ah la il y a une erreur ds la console:
SyntaxError: missing } after function body[En savoir plus] script.js:48
</pre><menu type="context" id="actions"><menuitem id="goToLine" label="Aller à la ligne…" accesskey="l"></menuitem><menuitem id="wrapLongLines" label="Retour à la ligne automatique" type="checkbox" checked="true"></menuitem><menuitem id="highlightSyntax" label="Coloration syntaxique" type="checkbox" checked="true"></menuitem></menu></body></html>
ce qu'il y a en gras qui est surligné dans la console
SyntaxError: missing } after function body[En savoir plus] script.js:48
</pre><menu type="context" id="actions"><menuitem id="goToLine" label="Aller à la ligne…" accesskey="l"></menuitem><menuitem id="wrapLongLines" label="Retour à la ligne automatique" type="checkbox" checked="true"></menuitem><menuitem id="highlightSyntax" label="Coloration syntaxique" type="checkbox" checked="true"></menuitem></menu></body></html>
ce qu'il y a en gras qui est surligné dans la console
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
4 704
25 août 2017 à 17:25
25 août 2017 à 17:25
Il manque surtout des points virgules dans ton js... lignes 48 49 50 ..
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
25 août 2017 à 22:49
25 août 2017 à 22:49
merci jordane , mais ça ne marche toujours pas
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
4 704
25 août 2017 à 23:04
25 août 2017 à 23:04
Vérifie dans la console les messages d erreur et reposte nous ton code modifié
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
25 août 2017 à 23:32
25 août 2017 à 23:32
<body> <form name="forsec"> <input type="text" size="3" id="secb" name="secb" value="00"> <input type="text" size="3" id="seca" name="seca" value="00"> <input type="text" size="3" id="secc" name="secc"value ="00"> <input type="button" id="demarre" value="Start" /> <input type="button" id="pause" value="Pause" /> <input type="button" id="efface" value="clear" /> </form> </body>
var centi=0; // initialise les dixièmes var secon=0; //initialise les secondes var minu=0; //initialise les minutes var demarre = document.getElementById("demarre").value; var pause = document.getElementById("pause").value; var efface = document.getElementById("efface").value; var compte function chrono(){ centi++; //incrémentation des dixièmes de 1 if (centi>9){centi=0;secon++} //si les dixièmes > 9, //on les réinitialise à 0 et on incrémente les secondes de 1 if (secon>59){secon=0;minu++} //si les secondes > 59, //on les réinitialise à 0 et on incrémente les minutes de 1 var centi = parseInt(document.getElementById("secc").value); var secon = parseInt(document.getElementById("seca").value); var minu = parseInt(document.getElementById("secb").value); compte=setTimeout('chrono()',100) //la fonction est relancée //tous les 10° de secondes document.getElementById("demarre").disabled=true; } function rasee(){ //fonction qui remet les compteurs à 0 document.getElementById("demarre").disabled=false; centi=0; secon=0; minu=0; document.getElementById("secc").value =centi; document.getElementById("seca").value =secon; document.getElementById("secb").value =minu; function stop(){ clearTimeout(compte);//arrête la fonction chrono() document.getElementById("demarre").disabled=false; } window.addEventListener("load",function(){ document.getElementById("demarre").addEventListener("click", chrono); document.getElementById("pause").addEventListener("click", stop); document.getElementById("efface").addEventListener("click", rasee); });
merci
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
4 704
26 août 2017 à 17:08
26 août 2017 à 17:08
- Tu ne nous a pas dit ce qu'il y avait dans la console
- Il nous faut le code HTML COMPLET de ta page ... pour voir où tu charges ton JS
- Il nous faut le code HTML COMPLET de ta page ... pour voir où tu charges ton JS
jordane45
Messages postés
38290
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2024
4 704
26 août 2017 à 17:08
26 août 2017 à 17:08
Ah.. et il manque encore un point-virgule sur une de tes lignes... je te laisse la chercher par toi même...
moon136
Messages postés
71
Date d'inscription
samedi 12 août 2017
Statut
Membre
Dernière intervention
17 avril 2018
26 août 2017 à 19:29
26 août 2017 à 19:29
merci, le script marche sur jsfiddle uniquement pas sur les navigateurs
https://jsfiddle.net/FrostyZ/3pLh4r8y/
voici mon html complet mais bon le soucis est dans le fichier js
merci
https://jsfiddle.net/FrostyZ/3pLh4r8y/
voici mon html complet mais bon le soucis est dans le fichier js
!DOCTYPE html PUBLIC> <html> <head> <meta charset="utf-8" /> <title>exercice11</title> <script src="script.js"></script> <link rel="stylesheet" type="text/css" href="docstyle.css" /> </head> <body> <form name="forsec"> <input type="text" size="3" name="secb" value="00"> <input type="text" size="3" name="seca" value="00"> <input type="text" size="3" name="secc" value="00"> <input type="button" id="demarre" value="Start" /> <input type="button" id="pause" value="Pause" /> <input type="button" id="efface" value="clear" /> </form> </body> </html>
merci