Simple Application of jQuerytimers timer _ jquery

As we all know, jQuery is very powerful and has many very handsome plug-ins. Next we will introduce the jQuery timer plug-in jQueryTimers. That JS has its own timer. Why should we use Jquery? For convenience, Jquery has encapsulated the setTimeout and setInterval methods of JS. The following is an example of an application:

The Code is as follows:

/**
* JQuery. timers-Timer implements actions for jQuery
* Written by Blair Mitchelmore (blair DOT mitchelmore AT gmail DOT com)
* Licensed under the WTFPL (http://sam.zoy.org/wtfpl ).
* Date: 2009/10/16
*
* @ Author Blair Mitchelmore
* @ Version 1.2
*
**/

JQuery. fn. extend ({
EveryTime: function (interval, label, fn, times ){
Return this. each (function (){
JQuery. timer. add (this, interval, label, fn, times );
});
},
OneTime: function (interval, label, fn ){
Return this. each (function (){
JQuery. timer. add (this, interval, label, fn, 1 );
});
},
StopTime: function (label, fn ){
Return this. each (function (){
JQuery. timer. remove (this, label, fn );
});
}
});

JQuery. extend ({
Timer :{
Global: [],
Guid: 1,
DataKey: "jQuery. timer ",
Regex:/^ ([0-9] + (? : \. [0-9] *)?) \ S * (. * s )? $ /,
Powers :{
// Yeah this is major overkill...
'Ms': 1,
'Cs ': 10,
'Ds': 100,
'S ': 1000,
'Da': 10000,
'Hs ': 100000,
'Ks ': 1000000
},
TimeParse: function (value ){
If (value = undefined | value = null)
Return null;
Var result = this.regex.exe c (jQuery. trim (value. toString ()));
If (result [2]) {
Var num = parseFloat (result [1]);
Var mult = this. powers [result [2] | 1;
Return num * mult;
} Else {
Return value;
}
},
Add: function (element, interval, label, fn, times ){
Var counter = 0;

If (jQuery. isFunction (label )){
If (! Times)
Times = fn;
Fn = label;
Label = interval;
}

Interval = jQuery. timer. timeParse (interval );

If (typeof interval! = 'Number' | isNaN (interval) | interval <0)
Return;

If (typeof times! = 'Number' | isNaN (times) | times <0)
Times = 0;

Times = times | 0;

Var timers = jQuery. data (element, this. dataKey) | jQuery. data (element, this. dataKey ,{});

If (! Timers [label])
Timers [label] = {};

Fn. timerID = fn. timerID | this. guid ++;

Var handler = function (){
If (++ counter> times & times! = 0) | fn. call (element, counter) = false)
JQuery. timer. remove (element, label, fn );
};

Handler. timerID = fn. timerID;

If (! Timers [label] [fn. timerID])
Timers [label] [fn. timerID] = window. setInterval (handler, interval );

This. global. push (element );

},
Remove: function (element, label, fn ){
Var timers = jQuery. data (element, this. dataKey), ret;

If (timers ){

If (! Label ){
For (label in timers)
This. remove (element, label, fn );
} Else if (timers [label]) {
If (fn ){
If (fn. timerID ){
Window. clearInterval (timers [label] [fn. timerID]);
Delete timers [label] [fn. timerID];
}
} Else {
For (var fn in timers [label]) {
Window. clearInterval (timers [label] [fn]);
Delete timers [label] [fn];
}
}

For (ret in timers [label]) break;
If (! Ret ){
Ret = null;
Delete timers [label];
}
}

For (ret in timers) break;
If (! Ret)
JQuery. removeData (element, this. dataKey );
}
}
}
});

JQuery (window). bind ("unload", function (){
JQuery. each (jQuery. timer. global, function (index, item ){
JQuery. timer. remove (item );
});
});

JS Code

The Code is as follows:

$ ("# Close-button"). click (function (){
$ (This). One time (1000, function (){
$ (This). parent (". main-window"). hide ();
});
});
$ ("# Cancel-button"). click (function (){
$ ("# Close-button"). stopTime ();
});

JQuery Timers plug-in address:
Http://plugins.jquery.com/project/timers

The following is the JQuery Timers application from the JavaEye forum.

Three functions are provided.
1. everyTime (time interval, [Timer name], function name, [number limit], [waiting for function completion])
2. oneTime (interval, [Timer name], call function)
3. stopTime ([Timer name], [function name])

The Code is as follows:

/*************************************** **********************
* EveryTime (interval, [Timer name], function name, [number limit], [waiting for function completion])
**************************************** *********************/

// 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, but the function program is 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 );

Custom time unit
Open source code
Find

The Code is as follows:

Powers :{
// Yeah this is major overkill...
'Ms': 1,
'Cs ': 10,
'Ds': 100,
'S ': 1000,
'Da': 10000,
'Hs ': 100000,
'Ks ': 1000000
}

You can customize what you want!