Based on the Jquery.timer plug-in implementation of a timer, the need for friends can refer to the next. Go to the official website to download the jquery Timers plugin and then refer to the HTML. This is 1.2 version.
Copy CodeThe code is as follows:
<script src= ". /javascripts/plugins/jquery.timers-1.2.js "type=" Text/javascript "></script>
Then the HTML, we can put a hidden server control to save the value, of course, this with you.
Copy CodeThe code is as follows:
<asp:hiddenfield id= "Hicurrenttime" runat= "Server"/>
JQuery Timers Test<input type= "button" id= "Btnmaster" value= "Starttimer"/>
Demos<div class= "Demos" >
<span id= "Durationtimerspan" ></span>
<br/>
<input id= "Txtresult" type= "text"/>
</div>
Plus JS:
[/code]
$ (document). Ready (function () {
var countnum = <%=hicurrenttime. Value%>;
$ (' #btnmaster '). Toggle (
function () {
$ (this). Val (' Stoptimer ');
$ (' #durationtimerspan '). EveryTime (+, ' Testtimer ', function (i) {
Countnum = Countnum + 1;
$ (this). html (' Duration: ' + countnum);
$ (' #<%=hicurrenttime. ClientID%> '). Val (Countnum);
});
},
function () {
$ (this). Val (' Starttimer ');
$ (' #durationtimerspan '). StopTime (' Testtimer ');
$ (' #txtresult '). Val (Countnum);
});
});
[HTML]
The key point of the above code is that we use the toggle function to implement the click button Switch Timer. This plugin has three methods:
EveryTime (Interval:integer | String, [label = Interval:string], fn:function, [times = 0:integer])
Execute every time
OneTime (Interval:integer | String, [label = interval:string], fn:function)
Execute once
StopTime ([Label:integer | String], [fn:function])
Stop it
Finally, our results are as follows:
A similar usage:
Copy CodeThe code is as follows:
Execute function test every 1 seconds ()
function Test () {
Do something ...
}
$ (' body '). everyTime (' 1s ', test);
Executes every 1 seconds
$ (' body '). everyTime (' 1s ', function () {
Do something ...
});
Executes every 1 seconds and names the timer named a
$ (' body '). everyTime (' 1s ', ' A ', function () {
Do something ...
});
Executes every 20 seconds, up to 5 times, and names the timer name b
$ (' body '). EveryTime (' 2das ', ' B ', function () {
Do something ...
},5);
Execute every 20 seconds, unlimited, and name the timer named C
If the time interval is reached, but the function is still not completed, wait for the execution function to finish before continuing the timing
$ (' body '). EveryTime (' 2das ', ' C ', function () {
Execute a program that will take more than 20 seconds
},0,true);
/***********************************************************
* OneTime (time interval, [timer name], calling function)
***********************************************************/
10 seconds after the countdown.
$ (' body '). OneTime (' 1das ', function () {
Do something ...
});
100 seconds after the countdown, and the name timer named D
$ (' body '). OneTime (' 1hs ', ' D ', function () {
Do something ...
});
/************************************************************
* STOPTIME ([timer name], [function name])
************************************************************/
Stop all timers on $ (' body ')
$ (' body '). StopTime ();
Stop a timer named a on $ (' body ')
$ (' body '). StopTime (' A ');
Stop the timer for all call Test () on $ (' body ')
$ (' body '). StopTime (test);
I hope this post is helpful to you. Author:petter Liu
Implement a timer based on the Jquery.timer plugin
