js循环添加监听器时 只有最后一个有效

最新推荐文章于 2024-09-16 09:30:00 发布
转载 最新推荐文章于 2024-09-16 09:30:00 发布 · 2.7k 阅读 · 0

本文探讨了在循环添加div元素并为其绑定监听器时出现的仅最后一个监听器生效的问题。通过理解闭包原理，提供了有效的解决方案。

尝试循环添加div后，循环给这些div添加监听器时，出现了bug，现象为只有循环中的最后一个监听器有效，该问题涉及到闭包，引用这篇博文中的第一个方法解决，下次遇到可参考:

http://blog.youkuaiyun.com/playboyanta123/article/details/17241597

在js中使用for循环注册监听事件
weixin_43812547的博客
02-01 696
在使用百度地图api进行开发时遇到了需要给地图上的点标记添加监听事件的需求，于是使用java开发时的习惯在for循环中给marker按钮添加监听事件，使用如下代码 for(var item in survs){ var markerName=survs[item].videoId; var coordinate=survs[item].coordinate; console.log(coordinate.sp
JavaScript进阶-循环事件加监听
qq_44813296的博客
03-08 2019
问题描述 当我们需要循环事件加监听，如需求：点击某个按钮, 提示"点击的是第n个按钮，结果发现点击不同按钮，结果都是相同。错误场景代码如下： <button>测试1</button> <button>测试2</button> <button>测试3</button> <script type="text/javascript"> var btns = document.getElementsByTagName('button
循环监听事件出错，只能监听最后一个
weixin_30426065的博客
06-01 150
(function(){ var i= 0; for (;i<value;i=i+1){ (function(j){ var flip_id = "#flip"+i+""; var panel_id = "#panel"+i+""; $(flip_id).click(function...
for循环绑定监听事件索引值总是最后一个
acm765152844的博客
02-26 3339
var Menu=$(".tab"); for(var i=0;i    $(".tab").eq(i).onclick=function(){          $(".tabContent").css("display","none");          $(".tabContent").eq(i).css("display","block");           }
js for循环变量值永远是最后一个解决方法（闭包）
dou1246的博客
08-30 2397
window.onload=function(){ var li=document.getElementsByTagName("li"); for(var i=0;i<li.length;i++){ li[i].onclick=(function(n){ 　　return function(){ alert(n);...
轻松理解Spring
weixin_38170829的博客
08-07 248
前言 这篇文章在前一段时间看到一位大佬写的，因为写的逻辑清晰、通俗易懂，当时我就整理了一下笔记，希望日后自己也行写出这样的文章。如果想对spring了解和入门的同学，相信认真阅读了本篇文章定会收获颇丰。 特此说明：此篇文章主要目的是当做范文，以此鼓励自己在不断学习总结中创作出更多更好的优质原创文章；找了半天没有找到原文章，如有打扰即刻删除。 主要内容： 默认题主说的Spring是Spring fr...
如何在JavaScript中为每次循环都添加一个事件监听器并保持其有效性？
最新发布
11-09
在JavaScript中，如果你想为每次循环都添加一个事件监听器，并确保这些监听器在循环结束后仍然有效，可以按照以下步骤操作： 1. 首先，你需要一个循环结构，比如`for`、`while`或`Array.prototype.forEach()`等。 ...
JS常见问题之为什么点击弹出的i总是最后一个
10-23
标题中的“JS常见问题之为什么点击弹出的i总是最后一个”指的是在JavaScript编程中，一个常见的问题：当点击页面上的多个元素（例如`<li>`列表项）时，预期是弹出对应元素的索引，但实际上总是弹出最后一个元素的...
jQuery动态添加节点循环流程图表代码
06-10
2. **监听用户交互**：设置事件监听器，如按钮的`click`事件，以便在用户触发添加新节点操作时执行相应的函数。 3. **动态创建节点**：在接收到添加节点的请求时，创建新的HTML元素，包括表示节点的文本、图标以及...
在循环内添加监听，数组越界
a245017940的博客
07-17 717
问题：在 for 循环内添加监听，当事件触发时，i 提示数组越界。 用Unity做了一个单选框，有十几个toggle，放在一个toggleGroup下面，用GetComponentsInChildren方法获取。 toggles = toggleGroup.GetComponentsInChildren<Toggle>(); 按如下代码循环添加监听，运行报错，提示数组越界。 for (int i = 0; i < toggles.Length; i++)...
javascript中循环绑定监听事件的解决方案
duomoluo的博客
02-19 1571
javaScript中当在一个for循环中绑定事件时，如果事件响应函数中使用了for循环中的局部变量时，会导致所有响应函数中使用的变量都是最后一次循环中的局部变量的值。         举例（此代码示例参考其他文章，找不到原文链接了）：  for(var i=1;i<=3;i++){ document.getElementById('btn' + i).addE
JavaScript高级——循环遍历加监听
Fan_web的博客
09-16 443
本文主要是分享了关于javascript中的循环遍历加监听的案例，下一篇继续分享JavaScript高级学习中的闭包的内容。
解决javascript中循环给组件添加事件，只有一个最后一个组件添加成功。或者？全部添加失败。
NewObjectMe的博客
11-15 1234
问题产生的原因 页面加载---->for循环执行（结束条件：i<6为例），执行完之后，i最后的值是6---->这时候事件要触发了，事件触发调用的这个function，它拿到的值是i=6–>导致最后一个事件都没有成功被触发。 问题解决方法 第一种：常用的方法是：使用闭包把i值封存 for(var i =0 ; i < 6 ; i++){ (function(i){添加事...
JS 中循环遍历加监听事件的问题
花铛
10-25 1846
实质就是作用域的问题。
function“闭包”解决for循环和监听器冲突的问题：
EyeT Hexleo
08-29 230
在弄百度地图的时候，需要给地图上的每一个标注（Marker）添加监听事件，   开始的想法当然是用for循环，但发现一个问题，无论点击那个标注，显示的内容都是一样的，   实在想不通就百度了一下，果然找到了解决办法，   以下为转载内容：     事件闭包 闭包是Javascript脚本语言的特性之一，不熟悉它的开发者很可能犯下面这种错误：页面有十个标注（Marker实例），我...
事件循环、事件监听、事件委托
weixin_30791095的博客
04-16 375
一、事件循环 JavaScript引擎是干什么用的？其实很简单--它的任务就是遍历应用中的每一行JavaScript代码，并且一次执行一行，意味着JavaScript是单线程的。这里最大的影响是：如果在JavaScript代码中有地方会占用大量的时间，那后面的代码都会被block住。那么JavaScript引擎怎么知道如何一次处理一行JavaScript代码？它使用的是一个调用栈call sta...
addEventListener 的用法
lishangua的专栏
04-16 1633
一般情况下，如果给一个dom对象绑定事件，
js 循环生成元素，并为元素添加click事件，结果只执行最后一个点击事件
weixin_45020738的博客
01-04 1098
js 循环生成元素，并为元素添加click事件，结果只执行最后一个点击事件 问题描述：有一个参数集合data，for循环为每一个参数生成一个dom元素，并附加onclick事件。生成之后发现点击事件里的参数全是data集合里的最后一个。 代码如下： 复制代码 复制代码 var dom=$(’#div_id’); for(var i=0;i<data.length;i++) { var children=document.createElement(“div”); children.οnclick=fu
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值