当前位置：文江博客话题详情

JavaScript 闭包

for循环里变量作用域

发布于 2022-09-05 08:16:12 字数 214 浏览 13 评论 0

for(var i in data){
$('#test'+i).on('change',function(){
        console.log(i);
    })
}

每个元素触发事件都会显示最后一个data里的i，数组就是data.length-1
感觉是闭包相关的问题，请问该如何修改
PS：let的写法我知道但是浏览器不兼容没法用

收藏 0

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

评论（8）

樱花落人离去 2022-09-12 08:16:12

你可以试一试看看可以解决你的问题；
for(var i in data){
(function(i){
$('#test'+i).on('change',function(){

    console.log(i);
})
})(i);

}

滥情哥ㄟ 2022-09-12 08:16:12

for (var i in data) {
    (function (i) {
        $('#test' + i).on('change', function () {
            console.log(i);
        })
    })(i);
}

后来的我们 2022-09-12 08:16:12

我来开个脑洞：既然是注册事件监听，那有没有可能把这个值当自定义数据传进去？

例如：

for(var i in data){
    $('#test'+i).on('change', {value:i}, function(e){
        console.log(e.data.value);
    });
}

≈。彩虹 2022-09-12 08:16:12

百度闭包！google闭包

仅此而已 2022-09-12 08:16:12

你可以这样理解:

var _bindToClick = function(idx){
     $(".demo" + idx).on("click",function(){
       alert( idx );
     })
}

for(var i = 0; i < dom.length; i++ ){
  _bindToClick(i);
}

叹梦 2022-09-12 08:16:12

for循环注册事件不太好，性能太差，通用性也差，还是委托吧

巷子口的你 2022-09-12 08:16:12

这跟js中变量的作用域有关，js并不以{}为作用域，而是以function为作用域的，你这个i输出的都是data的长度，
可以使用闭包来解决，或者使用let来代替var

梦里兽 2022-09-12 08:16:12

用一个立即调用函数保存作用域,当一个函数嵌套另一个函数,函数定义时的作用域链到函数执行时依然有效.

<body>
    <div>
        <div id="test1">test1</div>
        <div id="test2">test2</div>
        <div id="test3">test3</div>
    </div>
    <script src="jquery.js"></script>
    <script>
        $(function() {
            var data = [1, 2, 3];

            for (var i = 0; i < data.length; i++) {
                var e = data[i];
                (function(e) {
                    $('#test' + e).on('click', function() {
                        console.log(e);
                    });
                }(e));
                /* $('#test' + i).on('click', function() {
                    console.log(i);
                }); */
            }
        });
    </script>
</body>

~没有更多了~

关于作者

暂无简介

0 文章

0 评论

24 人气

关注发私信

相关话题

热门标签

操作系统程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端

推荐作者

lorenzathorton8

文章 0 评论 0

Zero

文章 0 评论 0

萧瑟寒风

文章 0 评论 0

mylayout

文章 0 评论 0

tkewei

文章 0 评论 0

17818769742

文章 0 评论 0

友情链接

我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的隐私政策了解更多相关信息。单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。

原文