2018-06-27

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>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,010评论 19 139
  • 一 基础篇 1.1 Java基础 面向对象的特征抽象:将一类对象的共同特征总结出来构建类的过程。继承:对已有类的一...
    essential_note阅读 711评论 0 0
  • jquery特殊效果 1.jquery特殊效果 fadeIn() 淡入 $btn.click(function()...
    老头子_d0ec阅读 149评论 0 0
  • 我朋友给我推荐了一个发型师,是她用了十年的造型师。 见面聊了聊,才知道小伙子确实有才!人还好,会聊天。这样就...
    遇见秀美阅读 230评论 0 1
  • 同一个号码已经拨了7遍,他依然没接。对于他一个手机不离身的人来说,我知道,他不会接了。 两天前他走的时候,我跟他说...
    1992和这个世界谈谈阅读 297评论 0 0