jquery.timer.js的使用

http://blog.sina.com.cn/s/blog_860353750100wjgr.html http://blog.csdn.net/dongxinxi/article/details/6307392
jQuery Timer是一款实用且功能强大的jquery插件，可以控制文档元素的显示方式，丰富的参数设置可以控制显示的更多细节，是一款优秀的定时器插件，使用非常方便，可支持目前几乎所有定时业务的需求。目前版本为1.2。下面就看看如何使用它吧 O(∩_∩)O~

使用示例

<!-- 引用相关JS库 -->

<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>

<script type="text/javascript" src="js/jquery.timer-.1.2.js"></script>

<script type="text/javascript">

// 网页加载完毕后，初始化timer插件

$(function() {

var opts
= {

min_unit: 'second',

isDate: true,

isRound: false,

split_sign: ':'

};

$("#tiemrId").timer("2011-12-19
18:00", opts);

});

</script>

<!-- 页面元素 -->

<div id="tiemrId"></div>

[align=left]参数说明[/align]

参数名	类型	默认值	说明
max_unit	string	null	最大定时单位，如天(dd)、小时(hh)
min_unit	string	'second'	最小定时单位，如秒(ss)、毫秒(ms)
split_sign	string	':'	定义各显示数字间的分隔符
split_sign_array	Array	null	定义各个显示数字的单位名称
default_sign	string	'-'	计时基数无效或过期时，显示的默认字符
isComplex	boolean	true	是否增强显示(即split_sign_array是否启用)
isRound	boolean	false	各个计时数字是否对精度敏感；若是，则采用四舍五入方式计算数值
isDate	boolean	true	倒计时基参数是否为Date类型
number_style	string	null	各个显示数字的style属性
number_ref_style	string	null	各个显示数字的class属性
container_style	string	null	控件容器的style属性
container_ref_style	string	null	控件容器的class属性
callback	function	function(){}	回调函数：当定时器结束时，调用的函数

注：最大/小定时单位的可选值为：day、hour、minute、second、millsecond（或使用简写形式：dd、hh、mi、ss、ms）

JQuery Timers提供了三个函式

1. everyTime(时间间隔, [定时器名称], 函式名称,
[次数限制], [等待函式程序完成])

2. oneTime(时间间隔, [定时器名称], 呼叫的函式)

3. stopTime ([定时器名称], [函式名称])

官方虽然有Demo，但是却没有列出使用的原始码，即便右键检视原始码，里面也没有完整针对每一种情况写出一组程序说明，所以我只好试着测试函式了。以下为测试程序报告：

[javascript] view
plaincopy

/*************************************************************

* everyTime(时间间隔, [定时器名称], 函式名称, [次数限制], [等待函式程序完成])

*************************************************************/

//每1秒执行函式test()

function test(){

//do something...

}

$('body').everyTime('1s',test);

//每1秒执行

$('body').everyTime('1s',function(){

//do something...

});

//每1秒执行，并命名定时器名称为A

$('body').everyTime('1s','A',function(){

//do something...

});

//每20秒执行，最多5次，并命名定时器名称为B

$('body').everyTime('2das','B',function(){

//do something...

},5);

//每20秒执行，无限次，并命名定时器名称为C

//若时间间隔抵到，但函式程序仍未完成则需等待执行函式完成后再继续计时

$('body').everyTime('2das','C',function(){

//执行一个会超过20秒以上的程序

},0,true);

/***********************************************************

* oneTime(时间间隔, [定时器名称], 呼叫的函式)

***********************************************************/

//倒数10秒后执行

$('body').oneTime('1das',function(){

//do something...

});

//倒数100秒后执行，并命名定时器名称为D

$('body').oneTime('1hs','D',function(){

//do something...

});

/************************************************************

* stopTime ([定时器名称], [函式名称])

************************************************************/

//停止所有的在$('body')上定时器

$('body').stopTime ();

//停止$('body')上名称为A的定时器

$('body').stopTime ('A');

//停止$('body')上所有呼叫test()的定时器

$('body').stopTime (test);