js for循环事件绑定之怪现状解决
来源:互联网 发布:软件开发工作计划范文 编辑:程序博客网 时间:2024/05/27 14:14
背景
有一个需求:为表格的每一行绑定一个mouseover事件。很简单的样子,只需遍历所有tr,为每个tr绑定mouseover事件即可。代码如下:
var trs = $("table").find("tr");for (var i=0; i<trs.length; i++) { $(trs[i]).bind("mouseover", function() { $(trs[i]).css("background"), "yellow"); });}
问题出现了,事件绑定无效,于是我就用顺序语句写。
var trs = $("table").find("tr");$(trs[0]).bind("mouseover", function() { $(trs[0]).css("background"), "yellow");});$(trs[1]).bind("mouseover", function() { $(trs[1]).css("background"), "yellow");});$(trs[2]).bind("mouseover", function() { $(trs[2]).css("background"), "yellow");});
竟然成功了,不可思议,难道我碰到假的for语句?于是赶紧百度压压惊。百度说:用闭包可以解决。
原因
事件什么时候触发?很明显要你做出相应动作才执行。for循环在你动作触发之前已经结束了,所以循环变量i就变成了trs.length,数组都溢出了怎么可能绑定事件成功。
解决
用一个函数把事件执行代码包起来,确保每次循环执行时,都能执行函数的内容。
var trs = $("table").find("tr");for (var i=0; i<trs.length; i++) { (function(i) { $(trs[i]).bind("mouseover", function() { $(trs[i]).css("background"), "yellow"); }); })(i);}
当然,还有其他解决方法,万能的百度、谷歌。
阅读全文
0 0
- js for循环事件绑定之怪现状解决
- js循环绑定事件
- DOM绑定事件 -for循环'
- js循环绑定事件解决方案
- js循环绑定事件解决方案
- js循环绑定事件解决方案
- Js循环绑定事件处理
- js怎么绑定循环事件
- js for循环绑定问题解决
- JS事件之绑定事件
- JavaScript 在for循环中绑定事件
- for循环绑定事件与闭包
- Js之for循环
- 【JS难题】循环内绑定对象事件
- js 在循环中绑定事件
- 解决UPDATEPANEL只绑定一次JS事件
- JS之for循环优化
- js图片预加载---for与onload事件,图片数据模型到界面的单项绑定,使用interval模拟循环操作
- 高级软件工程
- HDU 3466 Proud Merchants
- nodelist与HTMLCollection
- window用ssh连接本机虚拟机中的ubuntu
- Tensorflow NN.conv2d API
- js for循环事件绑定之怪现状解决
- Python安装常见问题处理
- Urllib
- C#开发WinForm窗体程序时,如何在子窗体中关闭窗口时并退出程序?
- longest substring
- canvas学习笔记一
- clang: error: linker command failed with exit code 1 (use -v to see invocation)
- 各种二叉树和查找结构总结
- POJ 2352 Stars 树状数组