jQuery中setTimeout的几种使用方法小结
更新时间：2013年04月07日 23:10:00 作者：
jQuery 中 setTimeout/setInterval 不能像在原生态 javascript 中那样使用, 否则会报错.
我们通过例子来说明一下jQuery中setTimeout的几种使用方法, 首先准备好测试用的DIV和公共函数:
复制代码 代码如下:
<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>
原生态 javascript 中的 setTimeout 基本用法是像这样子的.
复制代码 代码如下:
//原生态 javascript 中的 setTimeout 基本用法
functionfunA(){
log('funA...');
setTimeout('funA()', 1000);
}
funA();
下面是jQuery中setTimeout的几种使用方法. 在线实例
复制代码 代码如下:
//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命名空间上增加函数,适用面更广
$.extend({
funD:function(v){
log('funD...'+v);
setTimeout("$.funD("+(v+1)+")",1000);
}
});
$.funD(100);
});
用法2和用法3的区别很明显, 但用法3和用法4的区别在哪里呢?为什么说用法4比用法3适用面更广呢?通过下面这个例子可以很直观的明白二者的区别:
复制代码 代码如下:
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); //这一句是正常的, 明白两者之间的区别了吧
});
相关文章
最常使用javascript的场合就是表单的验证，而jQuery作为一个优秀的javascript库，也提供了一个优秀的表单验证插件——Validation。本文将详细介绍validation插件。下面跟着小编一起来看下吧2017-03-03
这篇文章主要介绍了对于jQuery性能的一些优化建议,jQuery是当下人气最高的JavaScript库,需要的朋友可以参考下2015-08-08
JQuery中attr方法和removeAttr方法用法实例
这篇文章主要介绍了JQuery中attr方法和removeAttr方法用法,实例分析了jQuery中attr方法设置属性与removeAttr方法移除属性的使用技巧,非常具有实用价值,需要的朋友可以参考下2015-05-05
本篇文章主要介绍了jQuery中的deferred对象和extend方法，具有很好的参考价值。下面跟着小编一起来看下吧2017-05-05
这篇文章主要介绍了提升jQuery的性能需要做好的七件事，希望真的帮助大家提升jQuery性能,需要的朋友可以参考下2016-01-01
下面小编就为大家分享一篇jQuery 防止相同的事件快速重复触发方法。具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-02-02
这篇文章主要介绍了jQuery操作动画,结合完整实例形式分析了jquery针对页面元素动画效果相关实现技巧,涉及jquery slideUp与slideDown方法的使用,需要的朋友可以参考下2020-01-01
本篇文章主要介绍了jquery DataTable实现前后台动态分页。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-06-06
这篇文章主要介绍了jQuery获取页面元素绝对与相对位置的方法,涉及jQuery中offset、position等方法的使用技巧,需要的朋友可以参考下2015-06-06
这篇文章主要介绍了jQuery循环动画与获取组件尺寸的方法,实例分析了animate用法及组件的操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
最新评论