JS事件函数不能传参数的解决办法。
来源:互联网 发布:zip解压软件 编辑:程序博客网 时间:2024/06/05 08:10
昨天遇到一个问题,关于事件函数的传参问题,现在我抽象出来代码如下:
HTML:
<div>0</div><div>0</div><div>0</div><div>0</div>现在我想用for循环给每个div加个单击事件,单击一下,弹出是第几个div即for循环里面的i的值,JS代码应该如下:
window.onload=function(){var div=document.getElementsByTagName('div');for(var i=0;i<div.length;i++){ div.item(i).onclick=function(){ alert(i);}}}
以上代码运行之后,发现单击的时候,每一个弹出的都是4。
这是为什么呢?原因很简单,在for语句进行循环的时候,并没有把在循环时候的i的值赋给
<pre name="code" class="javascript">alert(i);而是在循环的过程中,没有执行到内部,所以等到循环结束,i的值变成了4,最后单击的时候弹窗都是4.那么该怎么解决这个问题呢?
或许很容易想到一个办法——传参!执行以下代码!
window.onload=function(){var div=document.getElementsByTagName('div');for(var i=0;i<div.length;i++){ div.item(i).onclick=function(i){ alert(i);}}}运行之后,单击0,弹窗出现 [object MouseEvent] 提示是个鼠标事件对象,是因为在事件函数中,默认参数即是这个事件参数,那么我想实现上述想法,有没有其他的方法。既然无法传参,但是又必须通过外部的值来引用进来。目前我只想到一个办法,那就是我这样来写代码:
window.onload=function(){var div=document.getElementsByTagName('div');for(var i=0;i<div.length;i++){div.item(i).id=i+'aaaaaa';//通过给其定一个属性的值来引用。 div.item(i).onclick=function(i){ alert(this.id.substring(0,1));}}}再运行,点击之后,分别弹出0123.OK大功告成!
0 0
- JS事件函数不能传参数的解决办法。
- JS中setInterval、setTimeout不能传递带参数的函数的解决办法
- JS中setInterval、setTimeout不能传递带参数的函数的解决办法
- JS中setInterval、setTimeout不能传递带参数的函数的解决办法
- 火狐中js函数不能识别非全字母参数值的解决办法
- js函数参数有中文不能触发事件问题
- UIScrollView不能响应UITouch事件的解决办法
- UIScrollView不能响应UITouch事件的解决办法
- UIScrollView不能响应UITouch事件的解决办法
- UIScrollView不能响应touch事件的解决办法
- js函数的参数
- IE 不能运行JS的解决办法
- js中window.onload时间不能保存多个函数引用的解决办法
- js函数传字符串参数的问题
- js函数参数传递,引号的问题,第二次犯错,记下来,以后不能犯了!
- js的onclick字符串参数的解决办法
- jsp form事件和 js 函数不能并行
- js--事件--通用的事件侦听器函数
- MyEclipse+Tomcat+MAVEN+SVN项目完整环境搭建
- nginx代理功能演示
- #宝哥教你#查看jquery绑定的事件函数
- Qt、Qt Create、MinGW
- SPOJ375——Query on a tree(树链剖分模板详解以及入门)
- JS事件函数不能传参数的解决办法。
- POJ1338 Ugly Numbers
- 设计模式-组合模式
- MySQL的用户变量和系统变量
- 模板 欧拉筛法 分解质因数
- Android常用开源框架
- hive报错java.io.IOException: Could not find status of job:job_1470047186803_131111
- Android Audio System 之一:AudioTrack如何与AudioFlinger交换音频数据
- Android之drawable state各个属性详解