js立即执行函数应用--事件绑定
2017-06-26 11:47
399 查看
js中立即执行函数的应用:应用到事件绑定上。
少说多做,直接运行代码(代码中有注释):
运行结果:
当点击id为a1,a2,a3的div时分别触发对应的事件。
少说多做,直接运行代码(代码中有注释):
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>js立即执行函数应用--事件绑定</title> <style type="text/css"> div{ margin: 10px; border: 1px solid #009F95; cursor: pointer; } </style> </head> <body> <div id="a1"> a1 </div> <div id="a2"> a2 </div> <div id="a3"> a3 </div> <script src="https://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script> <script type="text/javascript"> $( function(){ var eve = ['#a1','#a2','#a3']; for(var i=0;i<eve.length;i++){ //关键点:立即执行函数 (function(i){ $(eve[i]).on('click',function(){ alert('触发第'+(i+1)+'事件'); }); })(i);//关键点:传入当前循环值i } } ); </script> </body> </html>
运行结果:
当点击id为a1,a2,a3的div时分别触发对应的事件。
相关文章推荐
- js立即执行函数应用--事件绑定
- js使用函数绑定技术改变事件处理程序的作用域
- js移除事件 js绑定事件实例应用
- js 事件绑定函数与this的使用
- js:window.onload事件 让一个js事件执行多个函数
- js立即执行函数
- js使用函数绑定技术改变事件处理程序的作用域
- [js]将某个函数放在onload事件中最先执行
- JS+Zero Clipboard swf复制到剪贴板 兼容浏览器(bind事件绑定函数)
- Js定时执行函数方法setTimeout,clearTimeout用法及按钮addEventListener,attachEvent侦听事件
- js中(function(){…})()立即执行函数写法理解
- js:window.onload事件 让一个js事件执行多个函数
- window.addEventListener来解决让一个js事件执行多个函数
- js几个简单的工具类函数 事件绑定处理、加载数据字典下拉框、重新加载下拉框、参数处理
- JS 事件绑定函数代码
- 牛腩购物 8 整合用户留言 动软生成器 ,.NET在后置代码中输入JS提示语句(背景不会变白),repeater 循环的时候事件判断,repeater 隔行 奇数行,item列,隐藏区块 Panel 的使用,前台绑定代码的时候使用函数
- JS 立即执行的函数表达式(function)写法
- JS 立即执行的函数表达式(function)写法
- JS定义一个立即执行的可重用函数
- window.addEventListener来解决让一个js事件执行多个函数