Javascript:无法调用未定义的方法

Question

这可能是一个常见错误，但我找不到其他方法来执行此操作。我正在使用 timeline.js 和以下代码创建显示多个项目的时间线

function createTimeline(){
        for(var length = data.section.length,i = 0; i < length; i++){
            var divWrapper = document.createElement("div");
            if(i != data.section.length - 1)
                divWrapper.setAttribute('class','timelineWrapper');
            $('body').append(divWrapper);
            layer[i] = new links.Timeline(divWrapper);
            links.events.addListener(layer[i], 'rangechange',
                function(){
                    var that = this;
                    var range = layer[i].getVisibleChartRange();
                    for (var j = 0; j < layer.length; j++){
                        if(j != i){
                            layer[j].setVisibleChartRange(range.start, range.end);
                        }
                    }
                }
            );
            layer[i].draw(data.section[i].project, options);   
        }
    }

它给出错误 Cannot call method 'getVisibleChartRange' of undefined 。这里有什么问题？为什么层[i]未定义？在事件范围更改本身期间未检测到它。

Answer 1

您必须绑定(bind)i在一个闭包内为您的 addListener 保存其值调用，如 i当 addListener 中的函数未定义时后来被打电话。尝试替换 addListener 的第三个参数使用以下内容进行调用:

(function(i) {
    return function() {
        var that = this;
        var range = layer[i].getVisibleChartRange();
        // Rest of code
    };
}(i)); // Anonymous function binds i in a closure