V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
lraining
V2EX  ›  问与答

js 的奇怪问题

  •  1
     
  •   lraining · 2018-10-04 19:20:26 +08:00 · 1512 次点击
    这是一个创建于 2002 天前的主题,其中的信息可能已经有所发展或是发生改变。
    for(var i=0; i<6; i++){
    var button = $("#"+ categories[i]);
    button.attr("index", i);
    button.click(function(){
    alert(button.attr("index"));
    });
    }
    如上代码所示,循环一个数组找出对应 id 的 button(自定义的 div),给每个 button 加入自定义属性 index,然后绑定事件,结果点击所有的 button 都是最后一个 button,点击 button 弹出的 alert 显示都是 5,为什么会出现这样的情况?
    7 条回复    2018-10-04 19:51:26 +08:00
    IamJ
        1
    IamJ  
       2018-10-04 19:25:25 +08:00 via iPhone
    闭包
    des
        2
    des  
       2018-10-04 19:28:10 +08:00 via Android
    for(let i=0; i<6; i++){
    caomu
        3
    caomu  
       2018-10-04 19:29:47 +08:00 via Android
    button.click 绑定应该放 for 外面吧。。。
    jianzhihao1996
        4
    jianzhihao1996  
       2018-10-04 19:30:27 +08:00 via Android
    作用域问题
    rabbbit
        5
    rabbbit  
       2018-10-04 19:39:53 +08:00
    button.click(function(){
    alert(button.attr("index"));
    });
    ---->
    button.click(
    (function(button) {
    return function() {
    alert(button.attr("index"));
    }
    })(button)
    );
    heimeil
        6
    heimeil  
       2018-10-04 19:40:13 +08:00
    你 click 里引用的 button 是上层的,每次循环都改变了,当你产生 click 事件的时候循环早就结束了,自然是引用到了循环最后一次产生的 button。

    jQuery 方式:
    alert($(this).attr("index"));

    JS 原生方式:
    button.click(function() {
    alert(this.attr("index"));
    }.bind(button));
    lraining
        7
    lraining  
    OP
       2018-10-04 19:51:26 +08:00
    感谢 6 楼,是的,应该是用$(this)代替 button,很明显的问题,还是得细心一些
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3233 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 11:40 · PVG 19:40 · LAX 04:40 · JFK 07:40
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.