为了账号安全,请及时绑定邮箱和手机立即绑定

jQuery setTimeout()函数使用方法

setTimeout在以前的js中是定时执行一个对象或函数,下面我来介绍jquery中的setTimeout函数使用方法有需要了解的朋友仔细的参考参考
setTimeout()
从载入后延迟指定的时间去执行一个表达式或者是函数;
仅执行一次 ;和window.clearTimeout一起使用.

我在

复制代码 代码如下:

$(document).ready(function(){
setTimout(test(),200);
function test()
{
alert(1);
}
});

只会执行一次,有朋友说可以使用

复制代码 代码如下:

setInterval ("showTime()", 5000);
function showTime()
{
var today = new Date();
alert("The time is: " + today.toString ());
}

但我调用下面方法也可以和setInterval一样哦

复制代码 代码如下:

<div id="div_debug"></div>
<script language="JavaScript">
//显示
function log(s){
$('#div_debug').append(s+'<br>');
}
//以下是 setTimeout 在 jQuery 中的用法
function funA(){
log('funA...');
setTimeout('funA()', 1000);
}
jQuery(document).ready(function($){
//用法1 : 把要调用的函数写在ready外面,使它成为全局函数
funA();
//用法2 : 直接写函数名,不能带括号也不能带引号,适合没有参数的函数
function funB(){
log('funB...');
setTimeout(funB, 1000);
}
funB();
//用法3 : 通过调用匿名函数来执行,适合有带参数的函数
function funC(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(101);
});
</script>

jQuery中setTimeout的几种使用方法

jQuery 中 setTimeout/setInterval 不能像在原生态 javascript 中那样使用, 否则会报错.

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

复制代码 代码如下:

<div id="div_debug"></div>
<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="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); //这一句是正常的, 明白两者之间的区别了吧
});

点击查看更多内容
1人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
JAVA开发工程师
手记
粉丝
168
获赞与收藏
3550

关注作者,订阅最新文章

阅读免费教程

感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消