妙网科技 妙网科技 首页 妙网科技 网站开发 妙网科技 最好用的JQ定时器插件jQuery Timers

最好用的JQ定时器插件jQuery Timers

所属栏目: 网站开发 | 更新时间:2016-12-23 | 阅读:4843 次

使用步骤

JQuery Timers应用知识

提供了三个函式

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

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

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

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

*   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);

自定义时间单位

打开源代码

找到

powers: {

   // Yeah this is major overkill...

   'ms': 1,

   'cs': 10,

   'ds': 100,

   's': 1000,

   'das': 10000,

   'hs': 100000,

   'ks': 1000000

  }

示例:


<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery定时器</title>
 
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="jquery.timers-1.2.js" type="text/javascript"></script>
 
<script>
 
        function check() {
            $("#Button1").attr("disabled", true);
            $("#Button1").val("正在提交,请稍等3秒.....");
            $('body').oneTime('3s', function() {
                $("#Button1").attr("disabled", false);
                $("#Button1").val("测试提交");
                alert("3秒后提交结果");
            });
        }
 
    </script>
 
</head>
 
<body>
 
<input id="Button1" onclick="check();return false;" value="测试提交" type="submit" name="Button1"
 
</body>
</html>