Implement a timer based on the jquery. Timer plugin

Download the jquery timers plug-in from the official website and reference it to HTML. 1.2 version CopyCode The Code is as follows: <SCRIPT src = "../javascripts/plugins/jquery. timers-1.2.js" type = "text/JavaScript"> </SCRIPT>

Then there is HTML. We can place a hidden server control storage value. Of course, this is your choice.Copy codeThe Code is as follows: <asp: hiddenfield id = "hicurrenttime" runat = "server"/>
<H1>
Jquery timers test <Input type = "button" id = "btnmaster" value = "starttimer"/>
<H2>
Demos </H2>
<Div class = "demos">
<Span id = "durationtimerspan"> </span>
<Br/>
<Input id = "txtresult" type = "text"/>
</Div>

Add JS:
[/Code]
$ (Document). Ready (function (){
VaR countnum = <% = hicurrenttime. Value %>;
$ ('# Btnmaster'). Toggle (
Function (){
$ (This). Val ('stoptimer ');
$ ('# Durationtimerspan'). Everytime (1000, 'testtimer', function (I ){
Countnum = countnum + 1;
Certificate (this).html ('duration: '+ countnum );
$ ('# <% = Hicurrenttime. clientid %>'). Val (countnum );
});
},
Function (){
$ (This). Val ('starttimer ');
$ ('# Durationtimerspan'). stoptime ('testtimer ');
$ ('# Txtresult'). Val (countnum );
});
});
[HTML]
The key to the above Code is that we use the toggle function to implement the click button toggle timer. This plug-in has three methods:
Everytime (interval: integer | string, [label = interval: String], FN: function, [times = 0: integer])
Run
Onetime (interval: integer | string, [label = interval: String], FN: function)
Run Once
Stoptime ([label: integer | string], [FN: function])
Stop
Finally, our results are as follows:

Similar usage: Copy code The Code is as follows: // execute the test () function every 1 second ()
Function Test (){
// Do something...
}
$ ('Body'). Everytime ('1s ', test );
// Execute every 1 second
$ ('Body'). Everytime ('1s ', function (){
// Do something...
});
// Execute every 1 second and name the Timer
$ ('Body'). Everytime ('1s ', 'A', function (){
// Do something...
});
// Execute every 20 seconds, up to 5 times, and name the timer B
$ ('Body'). Everytime ('2das ',' B ', function (){
// Do something...
}, 5 );
// Execute every 20 seconds, unlimited times, and name the timer as C
// If the time interval is reached Program If the task is still not completed, you need to wait until the execution function is completed and continue timing.
$ ('Body'). Everytime ('2das ', 'C', function (){
// Execute a program that will take more than 20 seconds
}, 0, true );
/*************************************** ********************
* Onetime (interval, [Timer name], call function)
**************************************** *******************/
// Execute the task in the last 10 seconds
$ ('Body'). Onetime ('1das ', function (){
// Do something...
});
// Execute the task in the last 100 seconds and name the timer D.
$ ('Body'). Onetime ('1hs ', 'D', function (){
// Do something...
});
/*************************************** *********************
* Stoptime ([Timer name], [function name])
**************************************** ********************/
// Stop all timers on $ ('body ')
$ ('Body'). stoptime ();
// Stop the timer named a on $ ('body ')
$ ('Body'). stoptime ('A ');
// Stop the timer for all calls test () on $ ('body ')
$ ('Body'). stoptime (test );

I hope this post will be helpful to you. Author: Petter Liu