Bonsoir à tous,

Voilà dans un projet après la validation d'une signature sur un canvas, j'initie une instance d'une classe Decompte (elle met en place un compte à rebours de 20 mn). Le problème est que si jamais l'utilisateur décide avant la fin de se rebours, de faire une autre réservation (en validant sa signature sur un nouveau canvas) un nouveau rebours remplace le précédent : Le problème est qu'on aperçois par intermittence l'ancien rebours, bien que je lui ai appliqué un clearInterval...???!!

ici l'instanciation de mon decompte

 this.enregistrer.addEventListener("click", function(){ /*listener sur bouton confirmer la reservation*/           
            if(this.compteur !== 0){                
                this.veloDisp = this.veloDisp - 1;
                document.getElementById("nbreVelos").textContent = this.veloDisp + " velos disponibles";
                this.canvas.style.display = "none";
                this.enregistrer.style.display = "none";
                document.querySelector("form").style.display = "none";
                this.compteur = 0;                
                this.decompte.reset();/*applique le clearInterval*/
                this.decompte.creation();/*creation du compteur avec adresse de reservation, nom et prenom de l'utilisateur*/
                this.decompte.start();/*lance le decompte*/                
            }
              
        }.bind(this));

 et là ma classe Decompte

 creation (){ /* mise en place 1ere ligne avec adresse + nom */
        var infos = document.getElementById("infos");
        infos.innerHTML = "";
        infos.style.fontSize = "large";
        infos.textContent = "Vélo réservé à la station " + this.adr + " par " + document.getElementById(this.prenomId).value + " " + document.getElementById(this.nomId).value;
        sessionStorage.setItem("inforesa", infos.textContent);/*enregistrement en storage de la ligne infos et de l'adresse */
        sessionStorage.setItem("adresseInitiale", this.adr);
        
    }
    initDecompte(){        
        this.secondes = this.secondes - 1;        
        this.rebours.textContent = "Temps restant : " + this.minutes + " min : " + this.secondes + "s";
        this.rebours.style.fontSize = "x-large";
        sessionStorage.setItem("reboursMinutes", this.minutes);/*enregistrement en storage des minutes et secondes */
        sessionStorage.setItem("reboursSecondes", this.secondes);
        if (this.secondes === 0){
            this.minutes = this.minutes - 1;
            this.secondes = 60;            
        }
        
        else if ((this.minutes === -1) && (this.secondes ===59)){/* fin du délai */
            this.reset();
            sessionStorage.removeItem("adresseInitiale");
            this.rebours.style.color = "white";            /*affichage du message de depassement de délai*/
            this.rebours.style.fontSize = "x-large";
            this.rebours.textContent = "Délais dépassé";           
        }
    }
    
    start(){         
        this.intervalId = setInterval(this.initDecompte.bind(this), 1000);/*interval d'1 seconde entre chaque execution*/
        
    }
    
    reset(){
        clearInterval(this.intervalId);/*arrête le decompte*/
    }

où est ce que j'ai fauté???

-
Edité par MohammedHsein 19 octobre 2018 à 22:31:08