JavaScript在for循环中绑定事件解决事件参数不同的情况


Posted in Javascript onJanuary 20, 2014

有时候要对响应一堆相似的事件,但是每个事件的参数都不同,一开始还以为挺简单的,用个for循环不就得了,结果发现,额,都是使用了最后一个参数。。。

上网查资料!!!结果大神说用闭包解决

代码:

for(var i=0;i<10;i++){ 
btns[i].onclick=(function(i){ 
return function(){alert(i)} 
})(i) 
}

大概原因是直接用btns[i].onclick=function(){alert(i)}时,JavaScript引擎会先将for循环里的代码执行完,

当用户出发onclick事件时,JavaScript会寻找i,结果会找到运算完成之后的i,也就是10

但是用闭包处理的话,i会成为函数的局部变量

Javascript 相关文章推荐
Js中sort()方法的用法
Nov 04 Javascript
JS截取字符串常用方法整理及使用示例
Oct 18 Javascript
jQuery动态创建html元素的常用方法汇总
Sep 05 Javascript
基于jQuery滑动杆实现购买日期选择效果
Sep 15 Javascript
浅析BootStrap中Modal(模态框)使用心得
Dec 24 Javascript
jQuery实现给input绑定回车事件的方法
Feb 09 Javascript
jQuery实现扑克正反面翻牌效果
Mar 10 Javascript
Mint UI 基于 Vue.js 移动端组件库
Nov 07 Javascript
vue数据传递--我有特殊的实现技巧
Mar 20 Javascript
vue小白入门教程
Apr 02 Javascript
使用wxapp-img-loader自定义组件实现微信小程序图片预加载功能
Oct 18 Javascript
在vue中对数组值变化的监听与重新响应渲染操作
Jul 17 Javascript
javascript break指定标签打破多层循环示例
Jan 20 #Javascript
js点击出现悬浮窗效果不使用JQuery插件
Jan 20 #Javascript
javascript中直接引用Microsoft的COM生成Word
Jan 20 #Javascript
通过复制Table生成word和excel的javascript代码
Jan 20 #Javascript
js取值中form.all和不加all的区别介绍
Jan 20 #Javascript
如何实现textarea里的不同文本显示不同颜色
Jan 20 #Javascript
引用外部脚本时script标签关闭的写法
Jan 20 #Javascript
You might like
使用PHP进行微信公众平台开发的示例
2015/08/21 PHP
PHP实现获取ip地址的5种方法,以及插入用户登录日志操作示例
2019/02/28 PHP
通过js脚本复制网页上的一个表格的不错实现方法
2006/12/29 Javascript
js 巧妙去除数组中的重复项
2010/01/25 Javascript
Jquery ThickBox插件使用心得(不建议使用)
2010/09/08 Javascript
人人网javascript面试题 可以提前实现下
2012/01/05 Javascript
基于jquery实现的定时显示与隐藏div广告的实现代码
2013/08/22 Javascript
Node.js 的异步 IO 性能探讨
2014/10/08 Javascript
js实现圆盘记速表
2015/08/03 Javascript
JS禁止查看网页源代码的实现方法
2016/10/12 Javascript
vue.js学习之递归组件
2016/12/13 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
2017/05/10 Javascript
使用淘宝镜像cnpm安装Vue.js的图文教程
2018/05/17 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
layui 表单标签的校验方法
2019/09/04 Javascript
基于html+css+js实现简易计算器代码实例
2020/02/28 Javascript
[00:20]DOTA2荣耀之路7:-ah fu-抢盾
2018/05/31 DOTA
[57:59]完美世界DOTA2联赛循环赛 Ink Ice vs LBZS BO2第一场 11.05
2020/11/05 DOTA
python3.3实现乘法表示例
2014/02/07 Python
Python实现竖排打印传单手机号码易撕条
2015/03/16 Python
python2.7安装图文教程
2018/03/13 Python
Python callable()函数用法实例分析
2018/03/17 Python
Python3爬虫学习之MySQL数据库存储爬取的信息详解
2018/12/12 Python
python 根据字典的键值进行排序的方法
2019/07/24 Python
python实现吃苹果小游戏
2020/03/21 Python
幼儿园英语教学反思
2014/01/30 职场文书
个人银行贷款担保书
2014/04/01 职场文书
我爱我校演讲稿
2014/05/21 职场文书
森林防火宣传标语
2014/06/27 职场文书
南湾猴岛导游词
2015/02/09 职场文书
中秋节寄语2015
2015/03/24 职场文书
加薪申请报告范本
2015/05/15 职场文书
公司费用报销管理制度
2015/08/04 职场文书
党员干部学习十八届五中全会精神心得体会
2016/01/05 职场文书
浅谈golang 中time.After释放的问题
2021/05/05 Golang
python中字符串String及其常见操作指南(方法、函数)
2022/04/06 Python