注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

浮游生物的博客

以扯蛋的态度面对操蛋的人生

 
 
 

日志

 
 

javascript中setTimeout 和setInterval的区别  

2010-12-22 15:16:18|  分类: js+jQuery |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

关键字: jquery 定时器 间隔

     window对象有两个主要的定时方法,分别是setTimeout 和 setInteval 他们的语法基本上相同,但是完成的功能取有区别。
  setTimeout方法是定时程序,也就是在什么时间以后干什么。干完了就拉倒。
  setInterval方法则是表示间隔一定时间反复执行某操作。
  如果用setTimeout实现setInerval的功能,就需要在执行的程序中再定时调用自己才行(setTimeout( ) 預設只是執行一次, 但我們可以使用一個循環方式, 使到一個setTimeout( ) 再啟動自己一次, 就會使到第二個 setTimeout( ) 執行, 第二個又啟動第三個, 這樣循環下去, 這 setTimeout( ) 就會不斷執行)。如果要清除计数器需要根据使用的方法不同,调用不同的清除方法:


var timeID = null;   
  
//timeout方法   
timeID=setTimeout('northsnow()',1000);   
clearTimeout(timeID);     
  
//interval方法   
timeID=setInterval('northsnow()',1000);   
clearInteval(timeID);  

 eg:


<script type="text/javascript">   
var count = 0;   
var timeID = null;   
function counter() {   
    count++;       
    $("#count").html(count + '%');   
    timeID = setTimeout("counter()", 1000);//注意:执行的函数需要加引号,否则会报错的
    if (count > 10) {   
        clearTimeout(timeID);   //注意:clearTimeout(timeID)必须位于setTimeout()之后,不能是之前,原因很容易呦!   
    }   
}   
$(function() {   
    counter();   
});   
</script>  

 


<script type="text/javascript">   
var count = 0;   
var timeID = null;   
function counter() {   
    count++;       
    $("#count").html(count + '%');   
    if (count > 10) {   
        clearInterval(timeID);   
    }       
}   
$(function() {       
    timeID = setInterval('counter()', 1000);  //注意:执行的函数需要加引号,否则会报错的 
       
});   
</script>  

    好了,基本原理明白了,剩下的就是自己灵活运用了,可以开发一些定时器或延时器之类的东东,如我的用法:

 

document.write('<script type="text/javascript" src="/images/js/jquery.floatDiv.js"></script>');
$(function(){
     $("#swt_box1").floatdiv('middle');
      $("#swtbox").floatdiv('middlebottom')
     $("#swt_close1").click(function(){$("#swt_box1").hide();});
     $("#swt_zx1").click(function(){$("#swt_box1").hide();});
    
     setInterval(function(){$("#swt_box1").show();},30000);
   
     });

var txt="";

function handleErr(msg,url,l)
{
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + l + "\n\n";
txt+="Click OK to continue.\n\n";
//alert(txt);
return true;
}

function message()
{
adddlert("Welcome guest!");
}
$(function(){
    
     $("#swtbox").floatdiv('middlebottom');
     setTimeout(function(){$("#swtbox").show();},1000);
     });



 

  评论这张
 
阅读(798)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018