精选名称:JQuery Timers
授权模式:WTFPL
官方网页:http://jquery.offput.ca/every/官方展示:http://jquery.offput.ca/every/底端
有时候必需定时做一个动作,像是每n秒透过ajax发送讯息伺服器,取得更新资讯。
一般的方式是使用Javascript的原生计时器函式 clearInterval、clearTimeout、setInterval、setTimeout,
不过原生函式在使用上不太直觉,而且无法快速的 指定套用在某个特定的网页元素,
另外他的间隔单位是以毫秒去计算(1秒=1000毫秒),嗯…我想要每5分钟做一次,
那我要设 定…60*60*1000=3600000秒…对吧?还是360000秒?
这时候快从哆啦B梦口袋拿出了JQuery Timers这个法宝就能解决这麻烦的问题。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);
如果你试著打开他的原始码,你可以发现下列这段程式码,正是时间间隔的字串缩写,所以我们也可以自订自己所需要的缩写字串,像是分,时之类的
// Yeah this is major overkill...
'ms': 1,
'cs': 10,
'ds': 100,
's': 1000,
'das': 10000,
'hs': 100000,
'ks': 1000000,
//自订单位
'm': 60000,
'h': 360000

示例1:

$("#close-button").click(function() {$(this).oneTime(1000, function() {$(this).parent(".main-window").hide();});
});
$("#cancel-button").click(function() {$("#close-button").stopTime();
});

示例2:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Simple Time Interval Page Element Refresh using JQuery and a sprinkle of Ajax</title>
<script language="javascript" src="jquery-1.2.6.min.js"></script>
<script language="javascript" src="jquery.timers-1.0.0.js"></script><script type="text/javascript">$(document).ready(function(){var j = jQuery.noConflict();j(document).ready(function(){j(".refreshMe").everyTime(1000,function(i){j.ajax({url: "refresh-me.php",cache: false,success: function(html){j(".refreshMe").html(html);}})})});j('.refreshMe').css({color:"red"});
});</script>
</head>
<body>
<div class="refreshMe">This will get Refreshed in 1 Seconds</div>
</body>
</html>

实现数据库实时更新 jQuery Timers相关推荐

  1. access mysql 同步更新数据_[access 数据库同步]Access数据库到Mysql数据库实时更新

    项目目标: 首先是将Access数据库中的大量数据(已经存好的原有百万级数据)转存到mysql数据库中,然后,随着Access中数据的增加,要同步更新mysql数据库,更新周期自定. 思路:一开始的转 ...

  2. Access数据库到Mysql数据库实时更新

    项目目标: 首先是将Access数据库中的大量数据(已经存好的原有百万级数据)转存到mysql数据库中,然后,随着Access中数据的增加,要同步更新mysql数据库,更新周期自定. 思路:一开始的转 ...

  3. 直连数据库实时更新数据,可视化报表这么做简直牛

    会数据库,会python,会做报表,到底有多吃香?我趁着周五没事,打开了某招聘,不到10分钟,竟然有好多HR让我换工作,不是说现在基本上不招人吗?是我太优秀了吗? 甚至还有不止一个跟我说报表+决策分析 ...

  4. 直连数据库实时更新数据,比python强大,可视化报表这么做简直牛

    会数据库,会python,会做报表,到底有多吃香?我趁着周五没事,打开了某招聘,不到10分钟,竟然有好多HR让我换工作,不是说现在基本上不招人吗?是我太优秀了吗? 甚至还有不止一个跟我说报表+决策分析 ...

  5. 帆软报表调用python脚本_直连数据库实时更新数据,比python强大,可视化报表这么做简直牛...

    会数据库,会python,会做报表,到底有多吃香?我趁着周五没事,打开了某招聘,不到10分钟,竟然有好多HR让我换工作,不是说现在基本上不招人吗?是我太优秀了吗? 甚至还有不止一个跟我说报表+决策分析 ...

  6. go监听mysql事件更新,有没有一种方法可以“监听”数据库事件并实时更新页面?...

    我正在寻找一种创建简单的HTML表的方法,该表可以在数据库更改事件发生时进行实时更新.特别是添加了新记录. 换句话说,将其视为执行人员仪表板.如果进行了销售并且在数据库中添加了新行(在本例中为MySQ ...

  7. 数据库数据显示在java表中_实现 从数据库读取数据显示在前台echarts图表里,图表可根据数据库数据实时更新。效果如图...

    实现 从数据库读取数据显示在前台echarts图表里,图表可根据数据库数据实时更新.效果如图 实现步骤 - 1.创建数据表 - 2.建立Java Web Project - 3.创建Bean对象 - ...

  8. echarts简单使用、echarts通过计时器进行动态更新数据、echarts连接数据库实时更新数据

    1.echarts引入 在官网下载并放入项目中. 引入echarts.js文件: <script src="./echarts.js"></script> ...

  9. flot.js ajax,如何画Flot实时更新图

    实时更新图表可以用到的地方有很多,如CPU负载图.内存用量图或是像在线人数图等,在这我们会用CPU负载图做为范例. CPU负载实时更新图 所需要的档案 所有的档案都需加到 里, 因为我们有用到时间格式 ...

最新文章

  1. js layui 弹出子窗体_Layui中JS实现弹出层的应用
  2. Cracking the coding interview--Q1.7
  3. Java 8 Time Api 使用指南【珍藏限量版】
  4. 使用java导入某个msn帐号的好友列表并发送消息
  5. python创建虚拟环境时出现拒绝访问_无法创建虚拟环境
  6. 2015-7-24 从新开始博客之路
  7. download plugin update site for offline installation
  8. ZooKeeper使用get命令无法获取节点版本信息
  9. 根据时间戳生成编号_使用雪花算法生成流水号!
  10. Windows安全中心无法使用解决方法
  11. jsoncpp操作类
  12. 微信圣诞头像来了,快给你的头像带上圣诞帽吧
  13. Bert系列:论文阅读Learning-to-rank with bert in tf-ranking
  14. [code] 胡凡算法笔记 DAY004
  15. 关于git的commit提交回退的三种命令模式
  16. 带你了解什么是Nginx(实操反向代理-负载均衡)
  17. .Net下的分库分表帮助类——用分库的思想来分表 - 秋夜 - 博客园
  18. C语言,常用的系统函数
  19. 3.3差错控制(检错编码、纠错编码)
  20. Android 11.0 SystemUI导航栏固定在底部显示的修改

热门文章

  1. 信息学奥赛C++语言:蒙氏数学难题
  2. 4.5.1 条件语句
  3. java 唯一id生成算法_唯一ID生成算法剖析
  4. 360天擎默认卸载密码_用好360(四)
  5. 一起学习C语言:初谈指针(二)
  6. 字符串Ascll格式转16进制
  7. thinkpad bios联想logo_最强12吋ThinkPad,X201终极改造:8代酷睿+双内存+NVMe
  8. PyG图神经网络框架--构建信息传递网络(MPN)
  9. linux那些事之page table
  10. ubuntun 16.04环境安装Caffe过程