关于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 相关文章推荐
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 Javascript
jQery使网页在显示器上居中显示适用于任何分辨率
Jun 09 Javascript
JavaScript跨浏览器获取页面中相同class节点的方法
Mar 03 Javascript
基于JSON格式数据的简单jQuery幻灯片插件(jquery-slider)
Aug 10 Javascript
js实现复选框的全选和取消全选效果
Jan 03 Javascript
利用VUE框架,实现列表分页功能示例代码
Jan 12 Javascript
a标签置灰不可点击的实现方法
Feb 06 Javascript
BootStrap中的Fontawesome 图标
May 25 Javascript
Vue 2.0的数据依赖实现原理代码简析
Jul 10 Javascript
js实现数组和对象的深浅拷贝
Sep 30 Javascript
JS代码简洁方式之函数方法详解
Jul 28 Javascript
Js实现粘贴上传图片的原理及示例
Dec 09 Javascript
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
关于文本留言本的分页代码
2006/10/09 PHP
PHP简单获取网站百度搜索和搜狗搜索收录量的方法
2016/08/23 PHP
Javascript对象中关于setTimeout和setInterval的this介绍
2012/07/21 Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
2013/05/07 Javascript
js实现简单的购物车有图有代码
2014/05/26 Javascript
超级给力的JavaScript的React框架入门教程
2015/07/02 Javascript
JS+Ajax实现百度智能搜索框
2017/08/04 Javascript
js捆绑TypeScript声明文件的方法教程
2018/04/13 Javascript
基于element-ui的rules中正则表达式
2018/09/04 Javascript
JavaScript数组去重的几种方法
2019/04/07 Javascript
JavaScript实现图片放大镜效果
2019/06/27 Javascript
简单了解vue中的v-if和v-show的区别
2019/10/08 Javascript
jQuery实现移动端下拉展现新的内容回弹动画
2020/06/24 jQuery
自己编程中遇到的Python错误和解决方法汇总整理
2015/06/03 Python
使用Python对Excel进行读写操作
2017/03/30 Python
Python批处理删除和重命名文件夹的实例
2018/07/11 Python
python画一个玫瑰和一个爱心
2020/08/18 Python
Python3中bytes类型转换为str类型
2018/09/27 Python
python 高效去重复 支持GB级别大文件的示例代码
2018/11/08 Python
python3实现字符串操作的实例代码
2019/04/16 Python
Pytorch抽取网络层的Feature Map(Vgg)实例
2019/08/20 Python
Python图像处理模块ndimage用法实例分析
2019/09/05 Python
python 实现IP子网计算
2021/02/18 Python
Web前端绘制0.5像素的几种方法
2017/08/11 HTML / CSS
利用CSS3的border-radius绘制太极及爱心图案示例
2016/05/17 HTML / CSS
印度尼西亚最好的小工具在线商店:Erafone.com
2019/03/26 全球购物
下面关于"联合"的题目的输出是什么
2013/08/06 面试题
StringBuilder和String的区别
2015/05/18 面试题
清华大学自主招生自荐信
2014/01/29 职场文书
计算机应用专业毕业生求职信
2014/06/03 职场文书
校园安全标语
2014/06/07 职场文书
2014基建处领导班子“四风”对照检查材料思想汇报
2014/10/04 职场文书
2015年小学生自我评价范文
2015/03/03 职场文书
《金钱的魔力》教学反思
2016/02/20 职场文书
浅谈pytorch中的dropout的概率p
2021/05/27 Python
如何理解及使用Python闭包
2021/06/01 Python