for循环绑定事件,闭包思想!
1、选项卡问题
总结:用alert()测试,是否得到对象。
2、闭包,解决作用域。
<script>
window.onload=function(){
var li=document.getElementsByTagName('li');
for (var i = 0; i < li.length; i++) {
(function(){
var p=i;
li[i].onmouseover=function(){
li[p].style.background='#ccc';
}
li[i].onmouseout=function(){
li[p].style.background='red';
}
})();
}
};
</script>
3、window.onload=function(){}
代码写在这里面,因为js是从上往下执行,如果不写到这里面,执行到此处就不能得到对象。或者把,script代码段放在后面。
for循环绑定事件,闭包思想!的更多相关文章
- JavaScript利用闭包循环绑定事件
我们经常在做前端面试题的时候,会遇到循环绑定事件后,输出打印结果,很多人总是搞不清楚,今天借此机会跟大家梳理一下闭包相关作用. 1.首先我们举一个简单的例子. html部分: <a href=& ...
- dom元素循环绑定事件的技巧
以前总觉得自己写的代码不太规范,尤其是写原生的时候.举个例子: 要为页面上所有".a"的元素绑定事件,当然了用jquery很方便:$('.a').bind("click& ...
- js的一个有意思的小题,闭包解决getElementByTagName的for循环绑定事件错误问题
问: i 会输出什么?改写成闭包的写法? <a href="javaScript:void(0)">a</a> <a href="javaS ...
- Angularjs 中 ng-repeat 循环绑定事件
用ng-repeat循环是如果有ng-click之类的事件需要传入参数我们一般这样写 <span class='del' ng-click="RemoveCost({{item.Id} ...
- jquery循环绑定事件
<html> <head> <title></title> <script type="text/javascript" sr ...
- javascript闭包传参和事件的循环绑定
今天看到一个javascript的题目,按常理循环绑定事件,但是得到的结果却不是想要的. <a href="#">text</a><br>< ...
- JQuery在循环中绑定事件的问题详解
JQuery在循环中绑定事件的问题详解 有个页面上需要N个DOM,每个DOM里面的元素ID都要以数字结尾,比如说 ? 1 2 3 <input type="text" nam ...
- 关于在for循环中绑定事件打印变量i是最后一次。
其实函数引用的外部变量都是最后一次的值. <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案。
由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案. 动态在页面上添加了5个按钮,实现的功能应该是点击对应按钮在控制台输出相应的索引.但因为应该 ...
随机推荐
- SQL备份表及相关笔记
create table history1301( remark nvarchar(64))create table history1302( remark nvarchar(64))create t ...
- oracle rac 日志体系结构!
告警日志集群节点集群件告警日志:$GRID_HOME/log/<hostname>/alert<hostname>.log数据库实例的告警日志:$DIAG_DESTINATIO ...
- 菜鸟-手把手教你把Acegi应用到实际项目中(1.1)
相信不少朋友们对于学习Acegi的过程是比较痛苦的,而且可能最初一个例子都没能真正运行起来.即使能运行起来,对于里面那么多的配置,更搞不清楚为什么要那么配,多配一个和少配一个究竟有什么区别? 最终头都 ...
- Python和Django在Windows上的环境搭建
作为一个.NET程序员,真心不喜欢Python以及PHP这种松散的语法.有人说,程序员应该多学几门语言,本想学习Java,无奈感觉Java的语法太啰嗦了.很多人都推荐Python,说它的语法简洁,执行 ...
- 关于AS3获取当前URL和浏览器信息
原文链接: http://www.baidu.com/link?url=8-mS_wTlQi5MGvLQ8Oqf34wA-glS4roi0AmMswussY3kpkXoVUnOQQOaj-NGf2Ik ...
- SDUT 3344 数据结构实验之二叉树五:层序遍历
数据结构实验之二叉树五:层序遍历 Time Limit: 1000MS Memory Limit: 65536KB Submit Statistic Problem Description 已知一个按 ...
- MSP430推荐网站
http://www.amobbs.com/thread-5092914-1-1.html http://www.amobbs.com/thread-4701106-1-1.html
- Can't locate Switch.pm in @INC
the perl version (5.14) shipped with 12.10 does not include the Switch.pm module needed while buildi ...
- android 自定义组件
Google 公司为我们开发Android应用程序提供了丰富的UI组件,有时一个控件无法满足我们的需求,这就要求我们同时使用两个三个或者个更多的控件一起使用.有些常用的组合我就把他写成一个自定的的组件 ...
- ios NSString常见的字符串操作 分割 查找
1.NSString *str = [[NSString alloc]init]; //简单粗暴,基本用不到 2.NSString *str = [[NSString alloc]initWi ...