Stop et récupérer time FlipClock

Version imprimable

1 pièce(s) jointe(s)

Salut,
j'ai utilisé la bibliothèque FlipClock pour créer timer
je veux crée une methode lorsque appuyer sur le button le timer arrêts et récupérer le temps
il y'a des methode dans la bibliothèque FlipClock comme stop() et getTime(), mais je ne sais pas comment je utilisé
j'ai crée la fonction stoptime, mais ne fontionne pas :/

Pièce jointe 187747
Code:

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 <html> <head> <link rel="stylesheet" href="flipclock.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="flipclock.min.js"></script> </head> <body onload="setTimeout('https://www.google.fr/',3000);"> <div class="clock" style="margin:2em;"></div> <script type="text/javascript"> var clock; $(document).ready(function() { clock = $('.clock').FlipClock(3000, { countdown: true, clockFace: 'MinuteCounter' }); }); function stoptime(){ clock.stop(); time=clock.getTime(); } document.write(time); </script> <button id="x" type="button" onClick="stoptime()">Click Me!</button> </body> </html>
Merci d'avance

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
$( function(){ // forme abrégée de $(document).ready( function( ){      
  
  var clock = $( ".your-clock" ).FlipClock({
    // ... your options here
  });
  
  setTimeout( function( ){
    var time = clock.getTime(); // Returns the FlipClock.Time object
    
    console.log( time.time ); // 20s OK !
  }, 20000 ); // 20s
   
});

merci daniel pour votre réponse

ce code ne fonctionne pas :(
comment je peux stopper le timer avec le button ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<div class="clock" style="margin:2em;"></div>
 
<script type="text/javascript">
var clock;
$( function(){  
var clock = $('.clock').FlipClock({
    countdown: true,
clockFace: 'MinuteCounter'
  });
});
 
setTimeout( function( ){
var time = clock.getTime(); // Returns the FlipClock.Time object
console.log(time.time); // 20s OK !
}, 30000 ); // 20s
</script>
 
<button id="x" type="button">Click Me!</button>

13/09/2015, 18h42
NoSmoking

Citation:

ce code ne fonctionne pas :(

ça c'est une information précieuse :aie:

Citation:

comment je peux stopper le timer avec le button ?

peut être que la simple lecture de la documentation devrait t'aider http://flipclockjs.com/#methods

Autant l'obtention du temps écoulé par time.time ne saute pas aux yeux (il faut parcourir l'API : http://flipclockjs.com/api), autant les options et les méthodes sont faciles à découvrir (http://flipclockjs.com/#methods).

Sans un minimum de recherche et d'effort, vous n'arriverez qu'à : "Cela ne fonctionne pas".
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 $( function(){ // forme abrégée de $(document).ready( function( ){ var clock = $( ".your-clock" ).FlipClock({ // ... your options here }); setTimeout( function( ){ clock.stop(function() { var time = clock.getTime(); console.log( time.time ); }); }, 20000 ); });

désolé daniel, je suis encore débutant avec jqery

j'ai résoudre le probleme

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
	<body>
 
	<div class="clock" style="margin:2em;"></div>
 
	<script type="text/javascript">
                $( function(){
		var clock = $(".clock").FlipClock(3000,{
                countdown: true,
                clockFace: 'MinuteCounter'
                });
 
                $("#btnStopCounter").click(function(){
                clock.stop();
                var time = clock.getTime();
                $('#int').val(time);
                }); 
         	});         
	</script>
 
	<button id="btnStopCounter">Stop counter</button> 
        <input id="int" type="text" name="lname">
 
	</body>

Bien, mais...

Code:

1
2
3
4
5
$( "#btnStopCounter" ).on( "click", function( ){
  clock.stop();
  var time = clock.getTime();
  $( "#int" ).val( time.time );
});