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

3459 단어 JQuery타이머
먼저 홈 페이지 에 가서 플러그 인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

좋은 웹페이지 즐겨찾기