Salut tout le monde !
Je souhaite créer un compte à rebours mais je bloque un peu...
Je l'ai d'abord créé simplement (photo 3) puis j'ai voulu transformer le code en POO (photos 1 & 2).
Là est le problème, tout à l'air de fonctionner sauf la décrémentation automatique chaque seconde (donc setInterval).
Avez-vous des idées ?
Merci d'avance
Le compte à rebours ne décrémente pas automatiquement
Re: Le compte à rebours ne décrémente pas automatiquement
Bonjour,
Difficile de répondre sans voir l'exécution et ajouter des log dans la console
J'aimerai bien avoir le code source complet pour pouvoir regarder.
Difficile de répondre sans voir l'exécution et ajouter des log dans la console
J'aimerai bien avoir le code source complet pour pouvoir regarder.
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php
https://www.toutjavascript.com/livre/index.php
Re: Le compte à rebours ne décrémente pas automatiquement
Oui en effet, j'aurais dû donner le code et non des screenshots...
Je pense avoir résolu le problème : j'ai remplacé "setInterval(this.secondesCounting, 1000);" par une fonction fléchée "setInterval(() => this.secondesCounting(), 1000);"
Je pense avoir résolu le problème : j'ai remplacé "setInterval(this.secondesCounting, 1000);" par une fonction fléchée "setInterval(() => this.secondesCounting(), 1000);"
Code : Tout sélectionner
<button id="button">Run</button><br><br>
<div id="counter"></div><br><br>
<button id="remove">Remove</button>
Code : Tout sélectionner
class Timer {
constructor() {
this.counter = document.getElementById("counter");
this.button = document.getElementById("button");
this.buttonRemove = document.getElementById("remove");
this.secondes = 13;
this.minutes = 0;
this.current_secs;
this.current_mins;
this.buttonClick();
this.removeClick();
this.ifstorage();
}
ifstorage() {
if (sessionStorage.getItem("Secondes")) {
this.secondes = sessionStorage.getItem("Secondes");
this.minutes = sessionStorage.getItem("Minutes");
this.running();
}
}
removeStorage() {
sessionStorage.clear();
}
storage() {
sessionStorage.setItem("Secondes", this.current_secs);
sessionStorage.setItem("Minutes", this.current_mins);
}
buttonClick() {
this.button.addEventListener("click", () => {
// secondesCounting();
this.running();
});
}
removeClick() {
this.buttonRemove.addEventListener("click", () => {
this.removeStorage();
});
}
secondesCounting() {
if (this.secondes > 0) {
this.secondes--;
this.current_secs = this.secondes;
this.current_mins = this.minutes;
this.addTextContent()
this.storage();
} else if (this.secondes == 0 && this.minutes > 0) {
this.secondes = 59;
this.minutes--;
this.current_secs = this.secondes;
this.current_mins = this.minutes;
this.addTextContent();
this.storage();
} else if (this.secondes == 0 && this.minutes == 0) {
clearInterval();
sessionStorage.clear();
this.counter.textContent = "fin";
}
}
running() {
this.secondesCounting();
setInterval(this.secondesCounting, 1000);
}
addTextContent() {
this.counter.textContent = this.current_mins + ":" + this.current_secs;
}
}
let countdown = new Timer();
Re: Le compte à rebours ne décrémente pas automatiquement
Oui, c'est la solution en effet
Je vois qu'il y a de la maitrise avec l'écriture de fonction flechée
bravo
Je vois qu'il y a de la maitrise avec l'écriture de fonction flechée
bravo
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php
https://www.toutjavascript.com/livre/index.php
Re: Le compte à rebours ne décrémente pas automatiquement
Salut webmaster,
Merci pour ta réponse
Je rencontre maintenant un nouveau problème :
Lorsque le timer fonctionne et que je clique une nouvelle fois sur le bouton, le timer décrémente bizarrement (plus rapidement et de façon saccadée).
Comment pourrais-je régler ça ?
Merci d'avance
Merci pour ta réponse
Je rencontre maintenant un nouveau problème :
Lorsque le timer fonctionne et que je clique une nouvelle fois sur le bouton, le timer décrémente bizarrement (plus rapidement et de façon saccadée).
Comment pourrais-je régler ça ?
Merci d'avance
Re: Le compte à rebours ne décrémente pas automatiquement
Je suppose que le 1er timer n'est pas détruit à la fin du décompte
Au lancement du second, les deux tournent en même temps
Il faut tuer le 1er avec clearTimeout()
https://www.toutjavascript.com/referenc ... imeout.php
Au lancement du second, les deux tournent en même temps
Il faut tuer le 1er avec clearTimeout()
https://www.toutjavascript.com/referenc ... imeout.php
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php
https://www.toutjavascript.com/livre/index.php
Re: Le compte à rebours ne décrémente pas automatiquement
En effet, le problème était bien là.
C'était assez évident d'ailleurs, merci !!!
C'était assez évident d'ailleurs, merci !!!