Arrêter / Redémarrer un setInterval

**Marine31** · 23/04/2014, 15h17

Bonjour,

Je suis étudiante en design, pour mon diplôme j'ai besoin d'une interface, assez simple mais je bloque sur un élément. Je n'ai jamais eu de cours de javascript alors je fais un peu ça de bric et de broc.

Il s'agit d'une page où le temps défile. A la base je voulais que, en cliquant sur l'écran ou en appuyant sur une touche du clavier le temps s'arrête, se fige. Et que en recliquant ça redemarre.

J'ai pas réussi quant au clic mais en faisant des boutons.

Le temps défile avec setInterval. J'arrive à l'arréter avec un clearInterval. Mais j'arrive pas à relancer l'Interval après. Tout ce que j'ai trouvé pour l'instant c'est de lancer une actualisation de la page mais c'est vraiment pas top. Je voudrais que ca se relance tout simplement.
J'ai trouvé des choses avec refreshInterval mais j'arrive pas à le faire marcher. J'ai pas mal farfouillé mais les seuls choses que je trouve fonctionnent sur des chrono et pas sur des timer comme le mien...et j'arrive pas à les adapter à ma page.

En espérant que quelqu'un pourra m'aider.
Voila mon code :

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html>
 
   <head>
           <meta charset="UTF-8" />
        <title>INSTANT</title>
        <meta name="content-language" content="fr">
        <meta name="robots" content="index,all">
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
 
 
   </head>
 
 
</document>
    <div id="date_heure">
     <script type="text/javascript">
 
 
document.getElementById('date_heure').style.font="bold 100px helvetica,serif";
document.getElementById('date_heure').style.color="#EB7370";
  
        function compZero(nombre) {
            return nombre < 10 ? '0' + nombre : nombre;
            }
 
        function date_heure() {
              const infos = new Date();
 
 
                //Heure
    document.getElementById('date_heure').innerHTML =compZero(infos.getHours()) + ' : ' + compZero(infos.getMinutes()) + ' : ' + compZero(infos.getSeconds()) + ' <br> ' ; 
 
 
    //Date
    const mois = new Array('01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12');
    const jours = new Array('01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31');
 
    document.getElementById('date_heure').innerHTML += jours[infos.getDate()-1] + ' ' + mois[infos.getMonth()] + ' ' + infos.getFullYear();
}
 
    var timer = setInterval("date_heure()", 1000); //Actualisation de l'heure
 
    </script>
  </div>    
 
 
<A href='javascript:clearInterval(timer)'>CEUILLIR L'INSTANT</A> <br>
 
<A href='javascript:refreshInterval(timer)'>RELANCER LE TEMPS</A>
 
 
</form>
</body>
</html>

Merci d'avance.

**SylvainPV** · 23/04/2014, 17h04

Plutôt que passer par a#href, utilise a#onclick

refreshInterval ne fait pas partie de la spécification à ma connaissance. Pour redémarrer le timer, tu peux simplement appeler à nouveau

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

timer = setInterval("date_heure()", 1000);

**Marine31** · 24/04/2014, 16h22

Effectivement, avec des boutons et des onclick ça fonctionne !!
Merci beaucoup !

Arrêter / Redémarrer un setInterval

JavaScript

Discussions similaires

Partager

Partager