1

我在 JS 中遇到了一些关于范围的问题，我刚刚开始了解。

我已经定义了一个对象并在其中进行了 .getJSON() 调用，但我似乎无法正确引用调用对象的属性：

// Vehicle object
function vehicle(id) {
    this.id = id;
    var that = this;
    // Fetch some JSON
    $.getJSON("json.php?act=vehicleInfo&id=" + this.id, function (json) {
        that.vehicleInfo = json
        that.icon = L.AwesomeMarkers.icon({ icon: that.vehicleInfo.icon, color: that.vehicleInfo.colour });
        that.polyline = new L.Polyline([[that.vehicleInfo.latitude, that.vehicleInfo.longitude]]);
        that.marker = L.marker([that.vehicleInfo.latitude, that.vehicleInfo.longitude], {icon: that.icon});
        that.marker.bindPopup("Test point");
        that.marker.addTo(map);
        that.polyline.addTo(map);
    });
}

// Vehicle move method
vehicle.prototype.move = function(latlng){
    this.marker.setLatLng(latlng);
    this.polyline.addLatLng(latlng);
}

当我调用 .move() 时，this.marker 是未定义的。我在哪里错了？

4

1 回答 1

6

不幸的是，Ajax 不是这样工作的。您不能依赖$.getJSON回调在任何特定时间完成，甚至完全不能。一种可能是使请求同步，但不推荐这样做，因为它会锁定浏览器。

唯一可能的两种解决方案是：

  1. 不要依赖ajax
  2. 使任何依赖于 ajax 回调结果的东西都依赖于回调本身。

也就是说，调用.move车辆的任何代码都必须作为$.getJSON调用的结果来完成。不过，你可以让它看起来更优雅一点：

this.jqxhr = $.getJSON(...
/* snip */
vehicle.prototype.move = function (latlng) {
    var veh = this;
    this.jqxhr.done(function () {
       veh.marker.setLatLng(latlng);
       veh.polyline.setLatLng(latlng);
    });
}
于 2013-04-09T14:21:02.153 回答