javascript循环绑定事件,只返回最后一个实例,解决办法
来源:互联网 发布:万网域名指向花生壳 编辑:程序博客网 时间:2024/06/09 15:31
例子:
<!DOCTYPE HTML><html><head><meta charset="utf-8" /><title>闭包演示</title><style type="text/css">div {background: gray;margin:5px;}</style><script type="text/javascript">function init() {var list = document.getElementsByTagName("div");for ( var i = 0; i < list.length; i++) {var div = list[i];div.onclick = function() {alert(div.innerHTML);};list[i].onmousemove = function() { this.style.backgroundColor = "green"; } list[i].onmouseout = function() { this.style.backgroundColor = "gray"; }}}</script></head><body onload="init();"><div>0</div><div>1</div><div>2</div><div>3</div><div>4</div></body></html>每次都弹出最后一次的结果4。
解决方案1:
function daili(element ) { this.clickFunc = function() { alert(" record" + element.innerHTML); } } function init(){ var list = document.getElementsByTagName("div"); for (var i = 0; i < list.length; i++) { list[i].onmousemove = function() { this.style.backgroundColor = "green"; } list[i].onmouseout = function() { this.style.backgroundColor = "gray"; } list[i].onclick = new daili(list[i]).clickFunc; } }
解决方案2:
function init(){ var list = document.getElementsByTagName("div"); for (var i = 0; i < list.length; i++) { list[i].onmousemove = function() { this.style.backgroundColor = "green"; } list[i].onmouseout = function() { this.style.backgroundColor = "gray"; } var div = list[i];function(div){div.onclick = function(){alert(div.innerHTML);}} } }解决方案3:
function init(){ var list = document.getElementsByTagName("div"); for (var i = 0; i < list.length; i++) { list[i].onmousemove = function() { this.style.backgroundColor = "green"; }; list[i].onmouseout = function() { this.style.backgroundColor = "gray"; }; var div = list[i]; // 匿名写法1 (function(o){ o.onclick = function(){ alert(o.innerHTML); }; })(div); } }
解决方案4:
function init(){ var list = document.getElementsByTagName("div"); for (var i = 0; i < list.length; i++) { list[i].onmousemove = function() { this.style.backgroundColor = "green"; }; list[i].onmouseout = function() { this.style.backgroundColor = "gray"; }; // 匿名写法2 (function(o){ var o = list[i]; o.onclick = function(){ alert(o.innerHTML); }; })(); } }
方案5:
function init() {var list = document.getElementsByTagName("div");for ( var i = 0; i < list.length; i++) {var div = list[i];div.onclick = function() {alert(this.innerHTML);};div.onmousemove = function() { this.style.backgroundColor = "green"; }; div.onmouseout = function() { this.style.backgroundColor = "gray"; }; }}
- javascript循环绑定事件,只返回最后一个实例,解决办法
- for循环绑定监听事件索引值总是最后一个
- jquery循环绑定事件有一个坑----总是绑定最后一个元素
- javascript循环添加事件,总是获取最后一个值
- 循环按钮添加事件总是执行最后一个的解决办法汇总
- Javascript利用closure循环绑定事件
- Javascript利用闭包循环绑定事件
- JavaScript 在for循环中绑定事件
- javascript 循环遍历绑定事件问题
- 【解决方案】闭包函数在for循环中的使用案例——for循环绑定监听事件索引值总是最后一个
- javascript 给一个对象绑定事件
- Javascript事件绑定的一个坑
- 循环监听事件出错,只能监听最后一个
- 实例分析JavaScript中的事件委托和事件绑定
- JavaScript闭包及实现循环绑定事件
- javascript中循环绑定监听事件的解决方案
- javascript闭包传参和事件的循环绑定示例探讨
- javascript闭包传参和事件的循环绑定示例探讨
- 关于strlen()
- 网络编程常用接口的内核实现----sys_socket()
- RF kill switch support
- iOS避免内存警告的一些建议
- UML——时序图
- javascript循环绑定事件,只返回最后一个实例,解决办法
- HDU 1829 A Bug's Life
- 完整 httpd.conf 配置详情及中文注解
- ios 真机调试的细节
- Gallay
- hdu 2818 Building Block(并查集,输出一元素下边有多少)
- 加速Web开发的9款知名HTML5框架
- static 在c和c++
- ubuntu下中文乱码解决方案(全)