JQuery.timer 플러그 인 기반 타이머 구현

먼저 홈 페이지 에 가서 플러그 인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