利用闭包遍历元素绑定事件

最新推荐文章于 2021-12-01 16:55:41 发布
最新推荐文章于 2021-12-01 16:55:41 发布
阅读量1.3k 收藏
点赞数
分类专栏： Javascript 文章标签： javascript 闭包 遍历 dom
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/WRian_Ban/article/details/51302578
版权

在javascript开发过程中，经常会遇到闭包问题，特别是在为一组dom元素绑定事件的时候，容易遇到多个代码块嵌套不执行，this指向与预期不同的情况。

情况一：
把需要绑定事件的dom元素放进数组，使用$.each()进行绑定。

$.each(divSelects,function() {
                $(this).click(function() {···}
        })
那等雨停吧
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
浅谈JS闭包中的循环绑定处理程序
12-10
前几天工作中写前端js代码时，遇到了遍历元素给它添加单击事件。就是这个问题让我整整调了一个下午。最后还是下班回家，上网查资料才知道怎么解决的。 （PS：之前也在《jQuery基础教程》第四版中看过讲循环绑定处理...
用JS获取元素某一事件上绑定的所有Listener
for ever的log——永远的足迹
11-21 1万+
使用Chrome浏览器，在开发者工具里面查看。 步骤是： Chrome DevTools->console->getEventListeners(document.querySelector('.someclass'));
jq遍历循环，给每个元素添加点击事件，并返回当前元素的索引值（闭包问题）
yehaocheng520的博客
03-30 5175
jq循环绑定点击事件造成闭包问题 需求：给每个带有tab类名的元素点击点击事件，点击时可以添加active类名，（用于样式切换），而且还需要返回当前元素对应的索引值： 方法一（出现闭包） 先引入jq jq引入之后的获取dom的方式： $(’.tab’) //获取到的是所有含有tab类名的元素，如果想要限制在某个区域内，可以再加个类名的限制。 $(’.tab’).each(function(index){ $(this).on(‘click’,function(){ console.log(index); $
jquery遍历给每个子元素绑定事件
果果的小窝
01-20 2万+
代码如下： $(function(){ $('.evals>li').each(function(index){ $(this).on('click',function(){ $('.text').val($('.evals>li').eq(index).html()); }) }) }) each()以每一个匹配的元素作为上下文来执行一个函数。 配合$
JavaScript - 闭包 - 实战运用 - 循环绑定事件详细解析
wendyGao_Yin的博客
12-01 3285
闭包是一种机制，函数执行，产生一个不被释放的上下文， 一是保护了上下文里面的私有变量不受外界干扰， 二是私有变量的值也保存了下来，可以供其下级上下文调取使用，这种机制叫做闭包。 闭包的弊端是会导致栈内存增加，项目中如果滥用闭包，会导致产品性能降低。 JS中获取的每一个DOM元素都是一个元素对象（堆内存），用有很多的属性和方法； 实现元素点击事件行为：xxx.onclick = function(){...} ,就是给元素对象的私有属性onclick赋值； 当点击的时候， 浏览器监听到事件触发帮我们.
JavaScript | 图解 | 闭包应用之循环事件绑定的N种解决办法
aningde的博客
12-15 244
文章目录0 / 闭包（1）闭包优点（2）闭包的弊端1 / 闭包应用（1）事件绑定（2）方案一：基于闭包的机制完成第一种闭包第二种闭包第三种闭包（3）方案二：自定义属性（4）方案三：事件委托 0 / 闭包 闭包：函数运行的一种机制（不是某种代码形式） （1）闭包优点 1、函数执行会形成一个私有上下文，如果上下文中的某些内容（一般是指堆内存地址）被上下文以外的一些事物（例如：变量/事件绑定等）所占用，则当前上下文不能被出栈释放【浏览器的垃圾回收机制GC所决定的】 闭包的机制：形成一个不被释放的上下文 （1）保.
javascript闭包使用：解决循环绑定事件问题
weixin_34096182的博客
12-01 238
2019独角兽企业重金招聘Python工程师标准>>> ...
JavaScript 遍历 闭包问题
黄沙百战穿金甲，不破楼兰终不还。
04-11 1380
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script> <title>Document</title> <scrip
JS中批量给元素绑定事件过程使用闭包解决
javagtcpp的专栏
04-04 1559
在JS中，你写一个for循环的时候，内部的循环变量I其实是会保存在它运行的函数或类内的，所以你会发现你给元素批量绑定事件的时候，出现i=最后一个循环变量的值，这就很坑爹啊，解决的方案有2钟，   思路就是：把这个循环变量保存起来，不要让它的作用域在整个函数，而是在循环体内               1.使用闭包(如果你不懂闭包，请打开百度：www.baidu.com)
js循环动态绑定带参数函数遇到的问题及解决方案[转]
12-02
众所周知，不带参数的绑定非常简单，只要使用（语法：“document.getElementById(“对象ID名”).attachEvent(“事件名，如onchange”,函数名);”）（示例：“document.getElementById(“select_0”).attachEvent(...
简短几句 通俗解释javascript的闭包
01-21
何谓没有被释放资源的栈区和预执行的过程，用一个最常见的示例来解释： 比方现在我们有一个ul，下面有很多个li，需要遍历他们为他们绑定单击事件，并在点击后将当前下标传递给另外一个function来进行额外的处理： ...
ActionScript开发技术大全
05-15
6.1.3数组元素的函数遍历 120 6.1.4元素处理 123 6.1.5数组复制 126 6.1.6查找与匹配 127 6.1.7数组排序 128 6.1.8数组与字符串 131 6.2关联数组 131 6.2.1Object类实现的关联数组 132 6.2.2Dictionary类实现的关联...
Jqury基础教程
10-14
3.6.2 重新绑定事件 3.7 模仿用户操作 3.8 小结 第4章 效果 4.1 修改内联CSS 4.2 基本的隐藏和显示 4.3 效果和速度 4.3.1 指定显示速度 4.3.2 淡入和淡出 4.4 复合效果 4.5 创建自定义动画 4.5.1 切换...
jQuery Ajax 设置请求头
热门推荐
WRian_Ban的小晴天
04-20 8万+
在项目中采用token来验证用户登录，运作机制大致如下 用户首次登录成功时，server-end发送token到客户端，client-end存入cookie。 用户做任何请求操作时，在ajax的headers里带上token，用以server-end做登录状态验证。 这时问题就来了···请求： $.ajax({ type: type, timeout: 100
动态创建Dom元素，并设置属性和类----JS&JQ
WRian_Ban的小晴天
04-09 7410
直接上的代码HTML代码<div class="pc-container"> </div>JS代码var container = $('.pc-container'); $('<img>').attr({ src:'images/star.png' }).css({ top:'50px', lef
Javascript数据结构与算法---数组
WRian_Ban的小晴天
04-07 4643
Javascript中对数组的定义数组在javascript中只是一种特殊对象，javascript的对象属性名必须是字符串。 所以用来表示偏移量的索引在内部会被转换为字符串。创建数组 []操作符var Arr=[]; console.log(Arr.length);//0 var Arr=[1,2,3,4,5]; console.log(Arr.length);//5 调用Array构造函数
javascript函数作用域和嵌套调用关系
WRian_Ban的小晴天
06-07 2117
JavaScript 的作用域是通过函数来定义的,在一个函数中定义的变量只对这个函数内部可见,我们称为函数作用域。特别注意：JavaScript 的作用域完全是由函数来决定的, if 、 for 语句中的花括号不是独立的作用域。在函数中引用一个变时,JavaScript 会先搜索当前函数作用域,或者称为“局部作用域”,如果没有找到则搜索其上层作用域,一直到全局作用域。函数作用域的嵌套关系是定义时决定
javascript----Array之Sort()
WRian_Ban的小晴天
04-02 1195
引入Sort()举个栗子 var arr=[1,3,98,23]; arr.sort(); console.log(arr);我期望得到的结果[1,3,23,98]; 阿西吧！说好的数值型呢？ 童话里都是骗人的 MDN这样告诉我···········！！！！！！！！！！！！！！ 呵呵，居然有这样变态的默认排序（曾经欺骗了多少和我一样无知单纯的孩纸
javascript如何循环绑定事件
最新发布
11-23
4.在闭包内部绑定事件，事件处理函数中使用闭包保存的索引值来获取当前元素。 5.在事件处理函数中编写具体的事件处理逻辑。 下面是一个示例代码，演示如何使用for循环和闭包来循环绑定事件： ```javascript // 获取...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值