Ajax循环设置全局变量成功

Question

我想通过函数设置全局变量并循环 ajax 来获取距离。但是 nearestIndex 变量始终未定义。

我得到的第一个解决方案是使用 async: false - 这在我的电脑浏览器中有效，但这个项目是 android 的网络服务，这个解决方案不是工作到 webview。

当然 async: false 不推荐。我需要这个例子，我一直在堆栈溢出中寻找这个问题，但我总是无法理解回调。

var allDestination = ["A", "B", "C"];
var nearestIndex;

function getNearest(){
 var from = myPosition.getLatLng().lat + "," + myPosition.getLatLng().lng;
 var tempDistance;
 for(var i=0; i<allDestination.length; i++){
  var destination = allDestination[i].getLatLng().lat + "," + allDestination[i].getLatLng().lng;
  $.ajax({
            type: "GET",
            url: "http://localhost:8989/route?point=" + from + "&point=" + destination + "&points_encoded=false&instructions=false",
            dataType: 'json',
            contentType: "application/json",
            success: function (data) {
             var distance = data.distance;
             if(i == 0){
              tempDistance = distance;
              nearestIndex = i;
             } else {
              if(distance < tempDistance){
               tempDistance = distance;
               nearestIndex = i;
              }
             }
            }
        });
 }
}

function onMapClick(e) {
 myPosition.setLatLng(e.latlng);         
 myPosition.addTo(map);
 getNearest();
 allDestination[nearestIndex].addTo(map);
}

Answer 1

我也遇到过和你一样的问题，这是因为 asincrounous 函数不能 return 任何东西。所以我认为你应该注入 allDestination[nearstIndex].addTo(map);进入 ajax 成功

if(i == 0){
                tempDistance = distance;
                allDestination[i].addTo(map);
            } else {
                if(distance < tempDistance){
                    tempDistance = distance;
                    allDestination[i].addTo(map);
                }
            }

或者您创建函数来处理 ajax 成功, CMIIW

Answer 2

因为你正在处理异步调用；您的相关代码必须从 ajax 调用的 success 处理程序中调用，如下所示：

var allDestination = ["A", "B", "C"];
var nearestIndex;
var tempDistance;
var successReceived = 0; //counter to keep watch on ajax success callback

//modify the function signature to receive index as well as callback function
function getNearest(index, callbackFunction) {
  var from = myPosition.getLatLng().lat + "," + myPosition.getLatLng().lng;

    var destination = allDestination[index].getLatLng().lat + "," + allDestination[index].getLatLng().lng;
    $.ajax({
      type: "GET",
      url: "http://localhost:8989/route?point=" + from + "&point=" + destination + "&points_encoded=false&instructions=false",
      dataType: 'json',
      contentType: "application/json",
      success: function(data) {
          successReceived++; //increment the success counter 
        var distance = data.distance;
        if (index == 0) {
          tempDistance = distance;
          nearestIndex = index;
        } else {
          if (distance < tempDistance) {
            tempDistance = distance;
            nearestIndex = index;
          }
        }

        //check if we got all the ajax response back. If yes then call the callback function
        if(successReceived == allDestination.length && typeof callbackFunction == 'function')
        {
            callbackFunction();
        }
      }
    });

}

function onMapClick(e) {
  myPosition.setLatLng(e.latlng);
  myPosition.addTo(map);

  for (var i = 0; i < allDestination.length; i++) {
      //pass the current index and callback function
      getNearest(i,function(){
          allDestination[nearestIndex].addTo(map);
      });
  }

}

Ajax循环设置全局变量成功

Ajax succes in loop to set global variable

javascript

jquery

ajax

android-webservice