先去官网下载jQuery Timers插件 ，然后引用到html中。这里是1.2 version 复制代码 代码如下: <script src="../Javascripts/Plugins/jquery.timers-1.2.js" type="text/javascript"></script> 　　然后是HTML，我们可以放一个hidden 的server control存值用，当然这个随你了。 复制代码 代码如下: <asp:HiddenField ID="hicurrenttime" runat="server" /> <h1> jQuery Timers Test</h1> <input type="button" id="btnmaster" value="StartTimer" /> <h2> Demos</h2> <div class="demos"> <span id="durationtimerspan"></span> <br /> <input id="txtresult" type="text" /> </div> 　　加上JS： [/code] $(document).ready(function() { var countnum = <%=hicurrenttime.Value %>; $('#btnmaster').toggle( function() { $(this).val('StopTimer'); $('#durationtimerspan').everyTime(1000, 'testtimer', function(i) { countnum = countnum + 1; $(this).html('Duration: ' + countnum); $('#<%=hicurrenttime.ClientID %>').val(countnum); }); }, function() { $(this).val('StartTimer'); $('#durationtimerspan').stopTime('testtimer'); $('#txtresult').val(countnum); }); }); [html] 上面的代码关键的地方是我们用toggle函数，去实现点击Button开关计时器。这个插件有三个方法： everyTime(interval : Integer | String, [label = interval : String], fn : Function, [times = 0 : Integer]) 每次都执行 oneTime(interval : Integer | String, [label = interval : String], fn : Function) 执行一次 stopTime([label : Integer | String], [fn : Function]) 停止 最后我们效果如下图： 类似的用法： 复制代码 代码如下: //每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); 希望这篇POST对您有帮助。Author: Petter Liu

　　推荐阅读

　　jQuery 锚点跳转滚动条平滑滚动一句话代码

jQuery锚点跳转滚动条平滑滚动一句话代码 复制代码 代码如下:$("html,body").animate({scrollTop: $("#box").offset().top}, 1000); 一下是一些jquery的小技巧1. 控制编译结果 复制代码 代码如下: <script type="t>>>详细阅读

本文标题：基于JQuery.timer插件实现一个计时器

地址：http://www.17bianji.com/kaifa2/JS/26503.html

 1/2    1