jQuery setTimeout用法总结(实例)

我们通过例子来说明一下jquery中setTimeout的几种使用方法, 首先准备好测试用的DIV和公共函数:

1、Jquery的实现方法
 

<div id="div_debug"></div> <script src="http://www.studyday.net/demo/jquery.js"></script> <script language="JavaScript"> functionlog(s){ $('#div_debug').append(s+'<br>'); } //以下代码可以放在这一行注释的下面,替换掉 //... //... </script>

2、javascript原生态的方法
 

//原生态 javascript 中的 setTimeout 基本用法 functionfunA(){ log('funA...'); setTimeout('funA()', 1000); } funA();

下面是jQuery中setTimeout的几种使用方法。

3、jquery用法
 

//jQuery 中的用法 functionfunA(){ log('funA...'); setTimeout('funA()', 1000); } jQuery(document).ready(function($){ //用法1 : 把要调用的函数写在ready外面,使它成为全局函数 funA(); //用法2 : 直接写函数名,不能带括号也不能带引号,适合没有参数的函数 functionfunB(){ log('funB...'); setTimeout(funB, 1000); } funB(); //用法3 : 通过调用匿名函数来执行,适合有带参数的函数 functionfunC(v){ log('funC...'+v); setTimeout(function(){funC(v+1)}, 1000); } funC(1); //用法4 : 通过在jQuery命名空间上增加函数,适用面更广 //by http://www.jbxue.com $.extend({ funD:function(v){ log('funD...'+v); setTimeout("$.funD("+(v+1)+")",1000); } }); $.funD(100); });

用法2和用法3的区别很明显, 但用法3和用法4的区别在哪里呢?
为什么说用法4比用法3适用面更广呢?

下面这个例子可以很直观的告诉你二者之间的区别:

4、

jQuery(document).ready(function($){ //用法3 : 通过调用匿名函数来执行,适合有带参数的函数 functionfunC(v){ log('funC...'+v); setTimeout(function(){funC(v+1)}, 1000); } //用法4 : 通过在jQuery命名空间上增加函数,调用起来更方便 $.extend({ funD:function(v){ log('funD...'+v); setTimeout("$.funD("+(v+1)+")",1000); } }); }); jQuery(document).ready(function($){ //funC(1); //去掉注释后执行这一句时会报错 $.funD(100); //这一句是正常的, 明白两者之间的区别了吧 });

您可能感兴趣的文章：
jQuery setTimeout用法总结(实例)
jQuery setTimeout()函数的用法介绍
JavaScript window.setTimeout() 的详细用法
jQuery中setTimeout的几种使用方法小结
JS计算网页停留时间示例代码
jQuery setTimeout()函数使用方法
javascript倒计时(setTimeout)的示例代码
基于jquery实现的定时显示与隐藏div广告的实现代码
js settimeout方法参数调用
Jquery中使用setInterval和setTimeout的方法