关于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 相关文章推荐
jquery 简单应用示例总结
Aug 09 Javascript
js使用html()或text()方法获取设置p标签的显示的值
Aug 01 Javascript
jQuery实现简洁的导航菜单效果
Nov 23 Javascript
jquery自定义插件——window的实现【示例代码】
May 06 Javascript
Bootstrap进度条与AJAX后端数据传递结合使用实例详解
Apr 23 Javascript
基于vue的短信验证码倒计时demo
Sep 13 Javascript
vue的传参方式汇总和router使用技巧
May 22 Javascript
详解vue-property-decorator使用手册
Jul 29 Javascript
基于layui框架响应式布局的一些使用详解
Sep 16 Javascript
vue iview实现动态新增和删除
Jun 17 Javascript
js实现筛选功能
Nov 24 Javascript
vue实现可以快进后退的跑马灯组件
Apr 08 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的拦截器实例分析
2014/11/03 PHP
php中通过eval实现字符串格式的计算公式
2017/03/18 PHP
JavaScript与函数式编程解释
2007/04/27 Javascript
25个非常棒的jQuery滑块插件和教程小结
2011/09/02 Javascript
jQuery中验证表单提交方式及序列化表单内容的实现
2014/01/06 Javascript
防止jQuery ajax Load使用缓存的方法小结
2014/02/22 Javascript
jQuery Migrate 1.1.0 Released 注意事项
2014/06/14 Javascript
火狐下input焦点无法重复获取问题的解决方法
2014/06/16 Javascript
JavaScript表单验证实现代码
2017/05/22 Javascript
vuex学习之Actions的用法详解
2017/08/29 Javascript
详解easyui基于 layui.laydate日期扩展组件
2018/07/18 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
2019/02/19 Javascript
js中比较两个对象是否相同的方法示例
2019/09/02 Javascript
Vue.js如何使用Socket.IO的示例代码
2019/09/05 Javascript
vue3.0 上手体验
2020/09/21 Javascript
JavaScript TAB栏切换效果的示例
2020/11/05 Javascript
vue 使用localstorage实现面包屑的操作
2020/11/16 Javascript
jquery实现拖拽小方块效果
2020/12/10 jQuery
Python Sleep休眠函数使用简单实例
2015/02/02 Python
详解Python中find()方法的使用
2015/05/18 Python
Python实现LRU算法的2种方法
2015/06/24 Python
Python程序员面试题 你必须提前准备!
2018/01/16 Python
python实现二叉查找树实例代码
2018/02/08 Python
tensorflow获取变量维度信息
2018/03/10 Python
解决在Python编辑器pycharm中程序run正常debug错误的问题
2019/01/17 Python
pytorch标签转onehot形式实例
2020/01/02 Python
使用Numpy对特征中的异常值进行替换及条件替换方式
2020/06/08 Python
python 如何区分return和yield
2020/09/22 Python
CSS3圆角和渐变2种常用功能详解
2016/01/06 HTML / CSS
英国最好的包装供应商:Priory Direct
2019/12/17 全球购物
大学生求职简历的自我评价
2013/10/21 职场文书
工商管理实习生自我鉴定范文
2013/12/18 职场文书
《鱼游到了纸上》教学反思
2014/02/20 职场文书
2015年元旦活动总结
2014/05/09 职场文书
工程部经理岗位职责
2015/02/02 职场文书
Java GUI编程菜单组件实例详解
2022/04/07 Java/Android