Question

我有一个对象列表，每个对象都有一个.bullet，它是一个SPAN。我想将跨度上的单击绑定到处理程序，而不是使用jQuery对跨度执行某个操作。我看到一些我不理解的行为，所以我希望有人可以解释发生了什么。基本上，这第一个代码示例有效：

for (var i = 0 ; i< length ; i++) {

            (function(){
                dataNode = dataNodeList[i];

                var handler = function(e) {

                    e.data.node.bullet.firstChild.nodeValue = "- ";


                };


                $(dataNode.bullet).on("click",{node:dataNode},handler);


            })();

        }

但是，第二种变体不起作用：

for (var i = 0 ; i< length ; i++) {

            (function(){
                dataNode = dataNodeList[i];

                var handler = function() {

                    dataNode.bullet.firstChild.nodeValue = "- ";


                };


                $(dataNode.bullet).on("click",handler);


            })();

        }

在第二个例子中，

dataNode.bullet.firstChild.nodeValue = "- ";

对我想要的SPAN的价值没有影响。我期望dataNode.bullet仍然指向我想要因为JavaScript关闭而改变的SPAN。那么，有人能解释为什么会失败吗？感谢。

Answer 1

试试这个：

for (var i = 0 ; i< length ; i++) {
    (function(index){
        var dataNode = dataNodeList[index];

        var handler = function() {
            dataNode.bullet.firstChild.nodeValue = "- ";
        };

        $(dataNode.bullet).on("click",handler);
    })(i);
}

闭包定义了一个新范围。这是必要的，因为直到循环结束后才调用处理程序，因此i在调用时不是作用域的一部分，或者（在某些情况下）具有循环中的最后一个可能值。

jQuery事件处理程序的JavaScript闭包

1 个答案: