`
xinlingwuyu
  • 浏览: 135742 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Javascript利用闭包循环绑定事件

阅读更多

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" >  
<head>  
    <title>Untitled Page</title>  
</head>  
<body>  
<ul id="list">  
<li>第1条记录</li>  
<li>第2条记录</li>  
<li>第3条记录</li>  
<li>第4条记录</li>  
<li>第5条记录</li>  
<li>第6条记录</li>  
</ul>  
<script type="text/javascript">  
    function tt(nob) {   
        this.clickFunc = function() {   
        alert("这是第" + (nob + 1) + "记录");   
        }   
    }   
    var list_obj = document.getElementById("list").getElementsByTagName("li"); //获取list下面的所有li的对象数组   
    for (var i = 0; i <= list_obj.length; i++) {   
        list_obj[i].onmousemove = function() {   
            this.style.backgroundColor = "#cdcdcd";   
        }   
        list_obj[i].onmouseout = function() {   
            this.style.backgroundColor = "#FFFFFF";   
        }   
        var col = new tt(i);   
        list_obj[i].onclick = col.clickFunc;   
    }   
</script>  
</body>  
</html>

分享到:
评论

相关推荐

    javascript闭包传参和事件的循环绑定示例探讨

    按常理循环绑定事件,但是得到的结果却不是想要的,下面有个不错的示例,可以为大家详细分解下

    浅谈JS闭包中的循环绑定处理程序

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件。在事件响应函数中(event handler)获取对应的索引。但每次获取的都是最后一次循环的索引。原因是初学者并未理解JavaScript的闭包特性。

    JavaScript在for循环中绑定事件解决事件参数不同的情况

    有时候要对响应一堆相似的事件,但是每个事件的参数都不同,一开始还以为挺简单的,用个for循环不就得了,结果...}时,JavaScript引擎会先将for循环里的代码执行完, 当用户出发onclick事件时,JavaScript会寻找i,结

    Javascript循环绑定事件的示例代码

    [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]这个例子循环为一组对象绑定事件处理函数。 但是,如果我们在这个基础上增加一些需求。比如在点击某一条记录的时候弹出这是第几条记录? 肯能你会理所当然的这么写:...

    js实现为a标签添加事件的方法(使用闭包循环)

    本文实例讲述了js实现为a标签添加事件的方法。分享给大家供大家参考,具体如下: 以示例说明: 实现效果:循环为带有ml-praise样式类的a标签添加事件,并且在点击a标签后,相应的数量增加1。 Html结构如下所示: ...

    javascript中的作用域和闭包详解

    主要向大家介绍了javascript中的作用域和闭包,以及利用js闭包实现循环绑定事件,感兴趣的小伙伴们可以参考一下

    curso-profesional-[removed]course-fundamentals-javascript Platzi JavaScript基础的所有课程JavaScript的第一步

    JavaScript的工作方式:解析器和抽象语法树,JavaScript引擎的工作方式,事件循环。 中级基础知识:承诺,获取者和设定者。 高级基础知识:代理,生成器。 DOM API:获取,交集,观察者,能见度变化,服务人员 ...

    js常见经典面试题汇总

    12.事件循环机制 13.原型与原型链 14.localStorage、sessionStorage、cookie区别 15.判断数据类型的方式以及区别 (typeof instanceof 他们两者的区别) 16.null typeof为什么是一个object 17.事件冒泡与事件捕获...

    ActionScript开发技术大全

    26.1.2ActionScript与JavaScript交互 566 26.1.3ActionScript与桌面程序交互 567 26.2网页脚本交互示例 568 26.3桌面应用交互示例 571 26.4小结 573 第27章ActionScript打印控制 574 27.1使用打印作业对象 574 ...

    JavaScript高级教程

    3.2.4 早绑定和晚绑定..............................................60 3.3 对象的类型..............................................60 3.3.1 本地对象..............................................60 3.3.2...

    (全)传智播客PHP就业班视频完整课程

    9-30 2 javascript的闭包 js变量作用域 9-30 3 仿超级玛丽兄弟游戏制作 9-30 4 构造方法 对象的常用操作 9-30 5 面向对象的封装 继承 多态 9-30 6 面向对象的封装 继承 多态2 9-5 1.php xml编程①-xml基本介绍 xml...

    韩顺平PHP JS JQUERY 所有视频下载种子 货真价实

    9-30 2 javascript的闭包 js变量作用域 9-30 3 仿超级玛丽兄弟游戏制作 9-30 4 构造方法 对象的常用操作 9-30 5 面向对象的封装 继承 多态 9-30 6 面向对象的封装 继承 多态2 9-5 1.php xml编程①-xml基本介绍 xml...

    python入门到高级全栈工程师培训 第3期 附课件代码

    05 jquery事件绑定与事件委托 06 jquery动画效果 07 jquery扩展与插件 08 jquery扩展补充 09 本周作业轮播图以及思路 第45章 轮播图片css部分 轮播图片js部分 第46章 01 数据库与dbms的概念 02 sql规范 03 ...

    史上最全韩顺平传智播客PHP就业班视频,10月份全集

    9-30 2 javascript的闭包 js变量作用域 9-30 3 仿超级玛丽兄弟游戏制作 9-30 4 构造方法 对象的常用操作 9-30 5 面向对象的封装 继承 多态 9-30 6 面向对象的封装 继承 多态2 9-5 1.php xml编程①-xml基本介绍 xml...

    史上最全传智播客PHP就业班视频课,8月份视频

    9-30 2 javascript的闭包 js变量作用域 9-30 3 仿超级玛丽兄弟游戏制作 9-30 4 构造方法 对象的常用操作 9-30 5 面向对象的封装 继承 多态 9-30 6 面向对象的封装 继承 多态2 9-5 1.php xml编程①-xml基本介绍 xml...

    史上最全韩顺平传智播客PHP就业班视频,9月份全集

    9-30 2 javascript的闭包 js变量作用域 9-30 3 仿超级玛丽兄弟游戏制作 9-30 4 构造方法 对象的常用操作 9-30 5 面向对象的封装 继承 多态 9-30 6 面向对象的封装 继承 多态2 9-5 1.php xml编程①-xml基本介绍 xml...

Global site tag (gtag.js) - Google Analytics