2

我有一个数组,其中包含与我创建的 Google Maps Polygon Objects 同名的字符串。我想遍历数组以设置特定选项。这是代码:

for (var i = 0; i < statesPoly.length; i++) {
    google.maps.event.addListener(statesPoly[i], 'mouseover', function() {
        statesPoly[i].setOptions({ strokeWeight: '2' });
    });
}

执行时,我得到“无法调用未定义的方法'setOptions'”,因为脚本似乎在字面上使用 statesPoly[i]。例如,当我将 statesPoly[i] 替换为 statesPoly[11] 时,脚本会按预期工作。

当我尝试这样的事情时,循环也按预期工作:

for (var i = 0; i < statesPoly.length; i++) {
    alert(statesPoly[i].strokeColor);
}

我究竟做错了什么?

更新:

这里越来越近。我相信this在某些情况下使用的原因是因为我的函数需要一个对象并且我给它一个字符串。会是这样吗?

alert(statesPoly[0]);
        google.maps.event.addListener(sarawakPoly, 'mouseover', function() {
            $("#"+statesPoly[0]).addClass("highlight");
            sarawakPoly.setOptions({ strokeWeight: '2' });
            //infowindow.open(map,marker);
        });

上面的代码将通过 SarawakPoly 发出警报,并且使用 statesPoly[0] 作为 ID 中的字符串可以按预期工作。这

 alert(statesPoly[0]);
        google.maps.event.addListener(statesPoly[0], 'mouseover', function() {
            $("#"+statesPoly[0]).addClass("highlight");
            statesPoly[0].setOptions({ strokeWeight: '2' });
            //infowindow.open(map,marker);
        });

不起作用,因为“未捕获的类型错误:无法读取未定义的属性‘鼠标悬停’”

如果我是对的,如何让我的 JS 将我的数组变量转换为对象?

4

3 回答 3

5

这是 JavaScript 代码中非常常见的错误:

for (var i = 0; i < n; i++) {
    registerSomeCallback(function () {
        console.log(i);
    });
}

在每次循环迭代中,变量i都会递增,并且由于 JavaScript 的词法作用域,在每次迭代中定义的函数共享相同的i变量。这意味着当调用回调时(在您的情况下发生 Google Maps 事件时),i将始终是循环到达的最后一个值。

就好像你正在这样做:

var i, fn;

i = 0;
fn = function () { alert(i); };
fn(); // will alert "0"
i = 1;
fn(); // i has changed, will now alert "1"
i = 2;
fn(); // i has changed again, will now alert "2"

您需要确保循环的每次迭代都有一个新的变量范围,例如:

for (var i = 0; i < n; i++) {
    (function (n) {
        registerSomeCallback(function () {
            console.log(n);
        });
    }(i));
}

在此版本的代码中,每个回调都在其自己的变量范围内定义,并带有自己的计数器变量(您仍然可以调用它i,但我调用n它是为了使示例更清晰)。

于 2012-06-01T19:07:32.273 回答
2

您可以尝试this改用吗?

    for (var i = 0; i < statesPoly.length; i++) {
      (function(i) {
        google.maps.event.addListener(statesPoly[i], 'mouseover', function() {
            this.setOptions({ strokeWeight: '2' });
        });
       })(i);
    }
于 2012-06-01T19:06:04.653 回答
1

statesPoly[i] 未定义,因为您的变量 i 未在您附加到事件侦听器的新函数中定义。

您可以在这里做几件事,但最简单的方法是将这个变量传递给函数。像这样的东西:

google.maps.event.addListener(statesPoly[i], 'mouseover', function(i) {
  statesPoly[i].setOptions({ strokeWeight: '2' });
});
于 2012-06-01T19:10:08.420 回答