使用for循环添加点击事件时,获取i值的方法
比如页面上有一个ul,数个li,现在给li添加点击事件。
var li = document.getElementsByTagName("li");
for(var i = 0; i < li.length; i++) {
li[i].addEventListener("click",function () {
console.log(i);
})
}
但是,这样写之后我们发现,点击任何一个li,打印的值都为5,这是因为闭包中共用i值,而i的值由于执行for循环,都变为了5
为了正常显示i值,我们可以使用如下方法:
for (var i = 0; i < lis.length; i++) {
(function(arg){
li[arg].onclick = function(){
console.log(arg);
};
})(i)
}
类似于这样
var li = document.getElementsByTagName("li");
for(var i = 0; i < li.length; i++) {
getConsole(i);
} function getConsole(i){
li[i].addEventListener("click", function() {
console.log(i);
}); }
使用for循环添加点击事件时,获取i值的方法的更多相关文章
- 继承UIView的子控件添加点击事件
UITapGestureRecognizer*tapGesture = [[UITapGestureRecognizer alloc]initWithTarget:selfaction:@select ...
- ECharts柱状图添加点击事件
参考: https://zhuanlan.zhihu.com/p/33050579 https://blog.csdn.net/sophia_xiaoma/article/details/780559 ...
- 【Unity】用代码给按钮动态添加点击事件
问题:多数情况下用UGUI的Button控件身上的OnClick()列表可以指明该按钮点击后触发的回调.现在想要调用自定义脚本里的方法,当这个脚本挂在Button所属的Canvas身上时,传入Canv ...
- a标签添加点击事件
a标签添加点击事件 CreateTime--2017年8月8日09:11:34 Author:Marydon 一.基础用法 方式一:(不推荐使用) <a href="javascr ...
- 给View 添加手势,点击无反应 如何给View添加点击事件,手势方法
项目中有很多地方需要添加点击事件,重复代码很多,所以做了一个UIView的分类,专门做点击事件使用.项目地址:UIView-Tap 代码很简单,主要有一点就是注意分类不能直接添加属性,需要用到运行时相 ...
- [Swift通天遁地]一、超级工具-(1)动态标签:给UILabel文字中的Flag和url添加点击事件
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- openlayers上添加点击事件
有很多场景会有这个需求,就是我绘制了图标,点击图标需要展示一些对应的信息 openlayer的事件主要是通过监听来完成的,你所有的icon的点击事件都是可以通过监听map的点击事件来处理对应的逻辑的 ...
- 移动端,ajax 动态加载的元素,为动态添加的一系列同个类名的元素添加点击事件
背景:一个列表页,有一系列同类名的元素,需要为每一个动态添加的列表项添加事件: 点击选择下图中不同的文档类型,再通过 ajax 动态加载不同的文档. 使用过的方法: 1.通知 jquery 的 $(s ...
- 【MAUI】为 Label、Image 等控件添加点击事件
一.前言 已经习惯了 WPF.WinForm 中"万物皆可点击"的方式. 但是在 MAUI 中却不行了. 在 MAUI 中,点击.双击的效果,是需要通过"手势识别器&qu ...
随机推荐
- zabbix3.2.4监控MySQL5.7.16状态
一.添加监控用户mysql> grant all privileges on *.* to 'zabbix'@'localhost' identified by 'zabbix';mysql&g ...
- 3.6.使用STC89C52控制MC20解析GPS的经纬度数据上传到指定服务器
需要准备的硬件 MC20开发板 1个 https://item.taobao.com/item.htm?id=562661881042 GSM/GPRS天线 1根 https://item.taoba ...
- IMG图片下面出现空格、下边距的解决办法
放图片的时候总有一个间隔,加上div看,是图片未充满div.最后父级元素加了一个 font-size:0,去掉了间隔. <div class="cut-img" style= ...
- classmethod和staticmethod区别
实例方法:在类中,定义的方法,这个方法的第一个参数默认是实例对象,一般习惯使用self 类方法:在类中,定义的方法,这个方法的第一个参数默认是类对象,一般习惯用cls表示,用@classmethod装 ...
- Python进阶(1)_Socket网络编程(基于tcp的socket)
网络协议参考:http://www.cnblogs.com/hedeyong/p/6889774.html 一.TCP/IP五层模型 学习socket一定要先学习互联网协议: 1.首先:本节课程的目标 ...
- iOS 结构简单清晰的 设置页面
这个是也是看了人家的代码,觉得甚是简单清晰,也是比较容易扩展.拿来学习一下 效果展示: 重点有以下2处: 1 .建立groupModel 列清组元素:当前组list 集合, 是否有header 或者 ...
- ES6 随记(1)-- let 与 const
1. const(声明一个只读的常量) 这个是很好理解的,且声明时就必须赋值而不能以后再赋,不然会报错. 而个人认为它最大的用处还是在于 {} 和 [] 上,const 保证了它的内存地址(指针)不变 ...
- 基于SSM的单点登陆02
pom文件 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http: ...
- CoreData的基本操作
Managed Object Model(被管理对象模型): –数据库的轮廓,或者结构.包含了各个实体的定义信息 Persistent Store Coordinator (持久性数据协调 ...
- 吴恩达深度学习笔记(十一)—— dropout正则化
主要内容: 一.dropout正则化的思想 二.dropout算法流程 三.dropout的优缺点 一.dropout正则化的思想 在神经网络中,dropout是一种“玄学”的正则化方法,以减少过拟合 ...