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 相关文章推荐
JavaScript实现Sleep函数的代码
Mar 04 Javascript
JavaScript 组件之旅(二)编码实现和算法
Oct 28 Javascript
ASP.NET jQuery 实例2 (表单中使用回车在TextBox之间向下移动)
Jan 13 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
Jan 13 Javascript
js window对象属性和方法相关资料整理
Nov 11 Javascript
解决微信浏览器Javascript无法使用window.location.reload()刷新页面
Jun 21 Javascript
JavaScript中this的用法实例分析
Dec 19 Javascript
Angular实现的内置过滤器orderBy排序与模糊查询功能示例
Dec 29 Javascript
vue 实现左右拖拽元素并且不超过他的父元素的宽度
Nov 30 Javascript
详解关于html,css,js三者的加载顺序问题
Apr 10 Javascript
帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
Aug 23 Javascript
微信小程序实现购物车代码实例详解
Aug 29 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通过正则表达式记取数据来读取xml的方法
2015/03/09 PHP
出现“不能执行已释放的Script代码”错误的原因及解决办法
2007/08/29 Javascript
用js模拟JQuery的show与hide动画函数代码
2010/09/20 Javascript
判断多个input type=file是否有已经选择好文件的代码
2012/05/23 Javascript
javascript当中的代码嗅探扩展原生对象和原型(prototype)
2013/01/11 Javascript
javascript中Object使用详解
2015/01/26 Javascript
jQuery+AJAX实现网页无刷新上传
2015/02/22 Javascript
Javascript中使用A标签获取当前目录的绝对路径方法
2015/03/02 Javascript
有关Promises异步问题详解
2015/11/13 Javascript
js阻止冒泡和默认事件(默认行为)详解
2016/10/20 Javascript
BootStrap的两种模态框方式
2017/05/10 Javascript
vue loadmore 组件滑动加载更多源码解析
2017/07/19 Javascript
微信小程序实现的一键连接wifi功能示例
2019/04/24 Javascript
vue项目添加多页面配置的步骤详解
2019/05/22 Javascript
vue柱状进度条图像的完美实现方案
2019/08/26 Javascript
js实现限定范围拖拽的示例
2020/10/26 Javascript
[46:42]DOTA2-DPC中国联赛正赛 Aster vs Magma BO3 第二场 3月5日
2021/03/11 DOTA
Python的Django框架使用入门指引
2015/04/15 Python
python smtplib模块自动收发邮件功能(一)
2018/05/22 Python
Python实现通过继承覆盖方法示例
2018/07/02 Python
详解Python用户登录接口的方法
2019/04/17 Python
分享8个非常流行的 Python 可视化工具包
2019/06/05 Python
python实现beta分布概率密度函数的方法
2019/07/08 Python
Python + Requests + Unittest接口自动化测试实例分析
2019/12/12 Python
Django User 模块之 AbstractUser 扩展详解
2020/03/11 Python
keras 两种训练模型方式详解fit和fit_generator(节省内存)
2020/07/03 Python
HTML5新控件之日期和时间选择输入的实现代码
2018/09/13 HTML / CSS
Boutique 1美国:阿联酋奢侈时尚零售商
2017/10/16 全球购物
会计电算化专业毕业生自荐信
2013/12/20 职场文书
银行营业厅大堂经理岗位职责
2014/01/06 职场文书
老师的检讨书
2014/02/23 职场文书
体现团队精神的口号
2014/06/06 职场文书
读后感作文评语
2014/12/25 职场文书
给女朋友道歉的话大全
2015/01/20 职场文书
Python 数据可视化之Matplotlib详解
2021/11/02 Python
Redis特殊数据类型HyperLogLog基数统计算法讲解
2022/06/01 Redis