js闭包for循环总是只执行最后一个值得解决方法
<style>
li{
list-style: none;width:40px;height: 40px;text-align:center;line-height: 40px;cursor: pointer;
}
</style>
html代码:
<ul id="uls">
<li style="background:#aaa">0</li>
<li style="background:#bbb">1</li>
<li style="background:#ccc">2</li>
<li style="background:#ddd">3</li>
</ul>
//这样写的话每次弹出都是最后一个值
// var lis=document.getElementsByTagName('li');
// for (var i = 0; i <=lis.length; i++) {
// lis[i].onclick = function(){
// alert(i);
// }
// };
使用闭包方法解决
//解决方法一:
var lis=document.getElementsByTagName('li');
for (var i = 0; i <=lis.length; i++) {
(function(i){
lis[i].onclick = function(){
alert(i);
}
})(i);
};
//解决方法二:
var lis=document.getElementsByTagName('li');
for (var i = 0; i <=lis.length; i++) {
lis[i].onclick = function(n){
return function(){
alert(n);
}
}(i);
};
//解决方法三(jquery):
$("ul li").click(function(){
var index = $(this).index(); //获取索引下标 也从0开始
alert($(this).html());
});
js闭包for循环总是只执行最后一个值得解决方法的更多相关文章
- ajax多次请求,只执行最后一次的方法
ajax多次请求,只执行最后一次的方法 有时候点击按钮进行异步请求数据的时候可能网络差,用户会点击很多次,或者页面有很多相同的按钮,参数不同,但是调用的ajax相同,只想得到最后一次结果 我的思路是用 ...
- Node.js中针对中文的查找和替换无效的解决方法
Node.js中针对中文的查找和替换无效的解决方法. //tags的值: tag,测试,帖子 var pos1 = tags.indexOf("测"); //这里返回-1 ta ...
- Linux不管上一条命令成功还是失败都执行下一个命令的方法
转载请注明来源https://www.cnblogs.com/sogeisetsu/p/11407830.html Linux不管上一条命令成功还是失败都执行下一个命令的方法 Linux不管上一条命令 ...
- js 循环生成元素,并为元素添加click事件,结果只执行最后一个点击事件
问题描述:有一个参数集合data,for循环为每一个参数生成一个dom元素,并附加onclick事件.生成之后发现点击事件里的参数全是data集合里的最后一个. 代码如下: var dom=$('#d ...
- node编写定时任务,for循环只执行一遍的解决办法
在用node编写定时任务时候,发现for循环只执行i=0这一次,就不接着循环执行了,下面贴上代码: exports.task = async function(ctx){ let { app } = ...
- ffmpeg在shell循环中只执行一次问题
最近写了一个shell脚本,发现 ffmpeg 命令只执行了一次就停了,最后找到原因: ffmpeg有时会读取标准输入流,导致命令出错,解决办法是在ffmpeg命令之后添加 #xxx ffmpeg x ...
- Js闭包与循环
目标:点击任何一个li,提示当前点击位置 <ul> <li>第1个</li> <li>第2个</li> <li>第3个</ ...
- 你知道js当中for循环当中的bug吗,如何解决它
本来以为for循环可以很好的解决一切问题,直到今天遇到了这段代码,刷新了我对for循环的认识,话不多说,直接上代码 var arr = [];for(var i = 0;i<10;i++) { ...
- js中如何在一个函数里面执行另一个函数
1.js中如何在函数a里面执行函数b function a(参数c){ b(); } function b(参数c){ } 方法2: <script type="text/javasc ...
随机推荐
- 论:开发者信仰之“天下IT是一家“(Java .NET篇)
比尔盖茨公认的IT界领军人物,打造了辉煌一时的PC时代. 2008年,史蒂夫鲍尔默接替了盖茨的工作,成为微软公司的总裁. 2013年他与微软做了最后的道别. 2013年以后,我才真正看到了微软的变化. ...
- 首个threejs项目-前端填坑指南
第一次使用threejs到实际项目中,开始的时候心情有点小激动,毕竟是第一次嘛,然而做着做着就感受到这玩意水好深,满满的都是坑,填都填不过来.经过老板20天惨无人道的摧残,终于小有成就. 因为第一次搞 ...
- PHP中遍历XML之SimpleXML
简单来讲述一些XML吧,XML是可扩展标记语言,是一种用于标记电子文件使其具有结构性的标记语言.XML是当今用于传输数据的两大工具之一,另外一个是json. 我们在PHP中使用XML也是用来传输数据, ...
- 创建ABPboilerplate模版项目
本文是根据角落的白板报的<通过ABPboilerplate模版创建项目>一文的学习总结,感谢原文作者角落的白板报. 1 准备 开发环境: Visual Studio 2015 update ...
- GJM : C#设计模式汇总整理——导航 【原创】
感谢您的阅读.喜欢的.有用的就请大哥大嫂们高抬贵手"推荐一下"吧!你的精神支持是博主强大的写作动力以及转载收藏动力.欢迎转载! 版权声明:本文原创发表于 [请点击连接前往] ,未经 ...
- springmvc SSM 多数据源 shiro redis 后台框架 整合
A集成代码生成器 [正反双向(单表.主表.明细表.树形表,开发利器)+快速构建表单 下载地址 ; freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本,处理类 ...
- PostGIS(解压版)安装
1.软件下载 postgresql-9.6.1-1-windows-x64-binaries.zip https://www.postgresql.org/download/windows/ post ...
- MySQL全文索引 FULLTEXT索引和like的区别
1.概要 InnoDB引擎对FULLTEXT索引的支持是MySQL5.6新引入的特性,之前只有MyISAM引擎支持FULLTEXT索引.对于FULLTEXT索引的内容可以使用MATCH()-AGAIN ...
- Prometheus 系统监控方案 一
最近一直在折腾时序类型的数据库,经过一段时间项目应用,觉得十分不错.而Prometheus又是刚刚推出不久的开源方案,中文资料较少,所以打算写一系列应用的实践过程分享一下. Prometheus 是什 ...
- javaMail
JavaMail概述: JavaMail是由Sun定义的一套收发电子邮件的API,不同的厂商可以提供自己的实现类.但它并没有包含在JDK中,而是作为JavaEE的一部分. javaMai ...