0

我有一个在循环id中生成的变量。for由于某种原因，id当它传入 a 时会从 0 变为 1 callback。我的猜测是我id错误地传递了参数。 

    refreshMenu: function(mods, callback){
    var menu = document.getElementById('menu'), 
            ul = document.createElement('ul');

    menu.innerHTML = ''; 
    menu.appendChild(ul);

    for(var id = 0; id < mods.length; id++){
        var li = document.createElement('li'), 
        that = this;


            ul.appendChild(li);

            li.setAttribute('id', id);
            li.innerHTML = mods[id].get('name');

            console.log(id); // HERE ---> 0

            li.addEventListener('click', function(){
                that.selectMenu(li, function(){

                    console.log(id); HERE ---> //1 ?

                that.selectList(id - 1);

                });
            }, false);
        }

        callback();
    }, 

    selectList: function(id)
        var activeList = this.activeList();

        console.log(id);

        if (activeList.id == id){
            return;
        } 
        else if (activeList){
            activeList.setAttribute('class', '');
        };

        var target = document.getElementById(id);
        target.setAttribute('class', 'activeList');
    },  

    selectMenu: function(li, callback){
        if(li.className == 'activeMenu') 
            return; 

        var active = document.getElementsByClassName('activeMenu')[0];
        if(active)      
            active.setAttribute('class', '');

        li.setAttribute('class', 'activeMenu');

        callback();
    },
4

2 回答 2

3

在for循环中构建闭包时，这是一个非常常见的问题。您创建的所有函数都引用同一个id变量，并且for循环会改变该变量。

解决此问题的一种简单方法：创建一个创建这些函数的辅助函数，并让辅助函数获取自己的参数。

// In the body of the for loop ...
var makeClickFunction = function (li, id) {
    return function (){
        that.selectMenu(li, function(){
                               console.log(id);
                               that.selectList(id - 1);
                            });
    };
};
li.addEventListener('click', makeClickFunction(li, id));

helper 对其id参数的绑定遮蔽了for循环的绑定，这是一件好事！我们是故意这样做的。我们也捕获li，因为它也需要被持有。

稍后，我们调用makeClickFunction ，在for循环 中传入当前值。for将继续改变它的id，但这没关系：这种改变与makeClickFunction的闭包行为没有关系。

于 2012-09-24T02:53:14.183 回答
1

的值id在回调被调用之前已经改变了，所以如果你想要在回调被调用时正确的 id 值，你需要闭包。

        li.addEventListener('click', function(){
            that.selectMenu(li, function(){

                console.log(id); HERE ---> //1 ?

            that.selectList(id - 1);

            });
        }, false);

==>

li.addEventListener('click', 
(function(li,that,id){
    return function(){
        that.selectMenu(li, function(){
        console.log(id); 
        that.selectList(id - 1);
        })
    }
})(li,that,id),
false);
于 2012-09-24T02:28:30.807 回答