今天 碰到这样一个问题 代码如下

  var someth = document.getElementsByTagName("a");
for (var i = 0; i < 10; i++) {
someth[i].addEventListener("click", function () { alert(i) })
}

  发现出问题了,每次都alert出同一个值 10  在网上找了找资料 发现原来是闭包导致的。

  我这里只贴两种解决方法吧。

  方法一:循环的时候给someth[i]一个属性,这样alert出的 i 的值才会改变。

 var someth= document.getElementsByTagName("a");
for (var i = 0; i <10; i++) {
someth[i].num = i;
someth[i].onclick = function () {
alert(this.num);
}
}

  方法二:在函数外面在嵌套一个函数.

var someth = document.getElementsByTagName("a");
for (var i = 0; i < 10; i++) {
someth[i].addEventListener("click", (function (num) {
return function () {
alert("i am link" + num);
}
})(i), "false");
}

PS:附上我看的资料  http://segmentfault.com/q/1010000000626710

addEventListener循环绑定出现的问题的更多相关文章

  1. JS中循环绑定遇到的问题及解决方法

    本文是原创文章,如需转载,请注明文章出处 在工作中,有时会有这样的需求:在一个页面上添加了6个按钮,然后分别为他们绑定点击事件监听器,当点击按钮1时,输出1,当点击按钮2时,输出2. 循环绑定代码如下 ...

  2. 由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案。

    由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案. 动态在页面上添加了5个按钮,实现的功能应该是点击对应按钮在控制台输出相应的索引.但因为应该 ...

  3. javascript闭包传参和事件的循环绑定

    今天看到一个javascript的题目,按常理循环绑定事件,但是得到的结果却不是想要的. <a href="#">text</a><br>< ...

  4. dom元素循环绑定事件的技巧

    以前总觉得自己写的代码不太规范,尤其是写原生的时候.举个例子: 要为页面上所有".a"的元素绑定事件,当然了用jquery很方便:$('.a').bind("click& ...

  5. JavaScript利用闭包循环绑定事件

    我们经常在做前端面试题的时候,会遇到循环绑定事件后,输出打印结果,很多人总是搞不清楚,今天借此机会跟大家梳理一下闭包相关作用. 1.首先我们举一个简单的例子. html部分: <a href=& ...

  6. 关于 DropDownList 循环绑定中遇到的问题

    1绑定DataTable 简单直接下部分就ok了 this.DropDownList1.DataSource = DataTable; this.DropDownList1.DataTextField ...

  7. js的事件循环绑定和jQuery的隐式迭代

    js的事件循环绑定和jQuery的隐式迭代 js事件循环绑定 jQuery隐式迭代 先举一个例子:给定一个ul,点击列表内的每一个li元素,使它的背景色变红,下边分别用js代码和jQuery实现. & ...

  8. 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作

    页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...

  9. 小程序实践(五):for循环绑定item的点击事件

    微信展示列表效果借助于 wx:for  简单写一个列表(wxml文件中): 对应的数据源(js文件中): 写一个点击监听: 效果: 以上.可以实现列表的item点击效果,但是无法到点击的item对应的 ...

随机推荐

  1. 备忘DES简单加密与解密

    package com.ego.util; import java.io.IOException; import java.security.SecureRandom; import javax.cr ...

  2. ubuntu 14.04安装nginx+php+mysql

    前段时间的折腾,颇费一番周折,过程中发现网上的许多资料比较老旧过时了,所以在这里也简单把过程重新整理一遍,争取一帖解决问题. 基于最新的Ubuntu 14.04(2014年9月)搭建nginx.php ...

  3. spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js...

    问题:spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js... web.x ...

  4. [NOIP2011] 聪明的质检员(二分答案)

    题目描述 小T 是一名质量监督员,最近负责检验一批矿产的质量.这批矿产共有 n 个矿石,从 1到n 逐一编号,每个矿石都有自己的重量 wi 以及价值vi .检验矿产的流程是: 1 .给定m 个区间[L ...

  5. ASP.NET Razor——ASP.NET Razor - C#代码语法

    Razor 同时支持 C# (C sharp) 和 VB (Visual Basic). 主要的 Razor C# 语法规则 Razor 代码块包含在 @{ ... } 中 内联表达式(变量和函数)以 ...

  6. less和sass

    sass 总体来说应用是和less差不多的,但是也有所不同     sass是用“$”符号来命名 然后加值来先引入后使用的方式.     同时也应该注意到的是sass有两种后缀名文件:一种后缀名为sa ...

  7. AndroidStudio Rename Package

    AndroidStudio中重命名包名的方法和可能遇到的问题 在开发中,可能会遇到需要重命名和合并某个包的情况.如果进行如下操作可能会导致以下结果: 在一个空包下创建一个包,会出现两个包名合并的情况. ...

  8. UI崩溃的解决方案

    在unity加载的时候主动强制关闭后,竟然ui崩溃,一直报错UnityEngine.UI.dll is in timestamps but is not known in assetdatabase. ...

  9. SQL:over partition by与group by 的区别

    group by是对检索结果的保留行进行单纯分组,一般总爱和聚合函数一块用例如AVG(),COUNT(),max(),main()等一块用. partition by虽然也具有分组功能,但同时也具有其 ...

  10. OS X Yosemite Beta体验

    自从看到Yosemite泄露图的那天起,就暗暗下决心,一定要坚守Mavericks阵营,坚决不升级,觉得新版系统界面简直其丑无比,结果过了没多久,就按耐不住了,在Windows下的虚拟机里面看了看,发 ...