关于setInterval、setTimeout在jQuery中的使用注意事项


Posted in Javascript onSeptember 28, 2011

以前写定时器的时候,总是习惯直接

setInterval("fn()",2000);
最近碰到个问题,在使用jquery写定时器时,总是会出现fn不存在的错误提示,如下

$(function(){setInterval("fn()",2000);})
解决方法是去掉引号和括号,采用最原始的方法

$(function(){setInterval(fn,2000);})
另外一种就是在书写jq的扩展,如下

$(function(){ 
$.extend({ 
fn:function(){ 
alert("im fn!"); 
} 
}); 
setInterval("$.fn()",2000); 
});

以上写法都是没什么问题的。但是如果需要传递参数该如何?

像上面第一种写法,

$(function(){setInterval(fn,2000);})
如果写成

$(function(){setInterval(fn(para),2000);})
就报错了。这个比较经典,比较白痴。

这时你可以内置一个function,写成

$(function(){setInterval(function(){fn(para)},2000);})
这样也是可以的。

至于第二种方法如何传递,这就更简单了,我就不多说了。

发到博客仅当记忆使用,都是基础啊!也是初学者容易犯错的地方!

//========================

还是补充下第二种传参的方法。

先看段代码

$(function(){ 
$start = 1; 
$.extend({ 
a:function(t){ 
$index = t; 
alert($index); 
$start++; 
} 
}); 
setInterval("$.a("+$start+")",2000); 
});

有一些人会尝试这么去写,结果是什么?结果就是alert出来的,一直是1,不会增加。这里需要注意的是setInterval里面的第一个参数,这是一个语句,用双引号括了起来,里面的东西会被解释成变量。如果按照上面的写法,相当于

setInterval("$.a(1)",2000);
那么结果也就无可厚非了。正确的写法,当然是这样

$(function(){ 
$start = 1; 
$.extend({ 
a:function(t){ 
$index = t; 
alert($index); 
$start++; 
} 
}); 
setInterval("$.a($start)",2000); 
});

这时$start才会被解释成变量。语句相当于function(){a(变量)},而不是function(){a(值)}。
Javascript 相关文章推荐
写了一个layout,拖动条连贯,内容区可为iframe
Aug 19 Javascript
Javascript Boolean、Nnumber、String 强制类型转换的区别详细介绍
Dec 13 Javascript
jquery mobile界面数据刷新的实现方法
May 28 Javascript
浅谈React 属性和状态的一些总结
Nov 21 Javascript
利用js来实现缩略语列表、文献来源链接和快捷键列表
Dec 16 Javascript
Vue.js学习笔记之常用模板语法详解
Jul 25 Javascript
JS实现的3des+base64加密解密算法完整示例
May 18 Javascript
微信小程序实时聊天WebSocket
Jul 05 Javascript
Vue+axios实现统一接口管理的方法
Jul 23 Javascript
Vue项目实现换肤功能的一种方案分析
Aug 28 Javascript
详解Angular Karma测试的持续集成实践
Nov 15 Javascript
详解Vue3.0 + TypeScript + Vite初体验
Feb 22 Vue.js
jQuery Ajax 仿AjaxPro.Utility.RegisterTypeForAjax辅助方法
Sep 27 #Javascript
Ext.get() 和 Ext.query()组合使用实现最灵活的取元素方式
Sep 26 #Javascript
一个挺有意思的Javascript小问题说明
Sep 26 #Javascript
Jquery之Ajax运用 学习运用篇
Sep 26 #Javascript
jQuery+CSS 实现随滚动条增减的汽水瓶中的液体效果
Sep 26 #Javascript
在Windows上安装Node.js模块的方法
Sep 25 #Javascript
javascript权威指南 学习笔记之null和undefined
Sep 25 #Javascript
You might like
php通用防注入程序 推荐
2011/02/26 PHP
腾讯微博提示missing parameter errorcode 102 错误的解决方法
2014/12/22 PHP
PHP进程同步代码实例
2015/02/12 PHP
php基于curl扩展制作跨平台的restfule 接口
2015/05/11 PHP
php中分页及SqlHelper类用法实例
2017/01/12 PHP
laravel框架关于搜索功能的实现
2018/03/15 PHP
JavaScript中“+”的陷阱深刻理解
2012/12/04 Javascript
javascript使用location.search的示例
2013/11/05 Javascript
文本域光标操作的jQuery扩展分享
2014/03/10 Javascript
基于jquery实现在线选座订座之影院篇
2015/08/24 Javascript
用canvas 实现个图片三角化(LOW POLY)效果
2016/02/18 Javascript
ionic实现可滑动的tab选项卡切换效果
2020/04/15 Javascript
vuejs2.0实现分页组件使用$emit进行事件监听数据传递的方法
2017/02/22 Javascript
vue2项目使用sass的示例代码
2017/06/28 Javascript
Mui使用jquery并且使用点击跳转新窗口的实例
2017/08/19 jQuery
使用veloticy-ui生成文字动画效果
2018/02/08 Javascript
bootstrap 路径导航 分页 进度条的实例代码
2018/08/06 Javascript
JavaScript 复制对象与Object.assign方法无法实现深复制
2018/11/02 Javascript
微信小程序实现获取小程序码和二维码java接口开发
2019/03/29 Javascript
JS+HTML5本地存储Localstorage实现注册登录及验证功能示例
2020/02/10 Javascript
浅谈Vue使用Elementui修改默认的最快方法
2020/12/05 Vue.js
[01:25]DOTA2超级联赛专访iG 将调整状态找回自己
2013/06/05 DOTA
[43:33]EG vs Spirit Supermajor 败者组 BO3 第一场 6.4
2018/06/05 DOTA
高效测试用例组织算法pairwise之Python实现方法
2017/07/19 Python
flask入门之文件上传与邮件发送示例
2018/07/18 Python
python3.5 cv2 获取视频特定帧生成jpg图片
2019/08/28 Python
用python解压分析jar包实例
2020/01/16 Python
ellesse美国官方商店:意大利高级运动服品牌
2019/10/29 全球购物
80后职场人的职业生涯规划
2014/03/08 职场文书
县政府班子个人对照检查材料
2014/10/05 职场文书
自我检讨报告
2015/01/28 职场文书
财务工作失误检讨书
2015/02/19 职场文书
民事诉讼代理词
2015/05/25 职场文书
合同补充协议书
2016/03/24 职场文书
微信小程序纯CSS实现无限弹幕滚动效果
2022/09/23 HTML / CSS