1

我有一个节点列表，我将使用 raphael 对象绘制每个节点。我有以下循环：

for(var i=0; i<curNodes.length; i++){
    var node = curNodes[i];
    var obj = paper.rect(node.getX(), node.getY(), node.width, node.getHeight())
   .attr({fill:nodes[i].getColor(), "fill-opacity": 0.6})
   .click(function(e){ onMouseClicked(i,e); });
}

单击时，我想调用一个函数，该函数可以查看与 curNodes 数组的“i”个元素关联的一些数据。但是，始终将最后一个“i”传递给此函数。我的功能是：

var onMouseClicked = function(i, event){
switch (event.which) {
    case 1:
        this.attr({title: curNodes[i].name});
        break;
    }
}

调用函数时应该如何访问正确的索引？

4

2 回答 2

3

试试这个：

.click((function (i) {
    return function (e) {
        onMouseClicked(i,e);
    };
})(i));

就像您注意到的那样，i（或函数中的参数）的值是for循环中的最后一个索引。这是因为click事件不会立即发生 - 绑定会发生，但i不会捕获 的值。到click处理程序实际执行时（click以任何方式触发事件时），for循环已经完成（很久以前），并且值i是循环的最终值。i您可以使用像上面这样的闭包来捕获 的值。

虽然我知道另一种处理方式，但我认为更清洁的是使用：

.click(clickHandler(i));

function clickHandler(index) {
    return function (e) {
        onMouseClicked(i, e);
    };
}
于 2013-04-25T04:03:01.577 回答
2

这是因为闭包变量i。

for (var i = 0; i < curNodes.length; i++) {
    (function(i) {
        var node = curNodes[i];
        var obj = paper.rect(node.getX(), node.getY(), node.width,
                node.getHeight()).attr({
                    fill : nodes[i].getColor(),
                    "fill-opacity" : 0.6
                }).click(function(e) {
                    onMouseClicked(i, e);
                });
    })(i);
}
于 2013-04-25T04:03:07.310 回答