Javascript Pass參數回調或在DistanceMatrixStatus中設置變量值

Question

我一直在玩Google的DistanceMatrixService。下面的代碼可以工作，但是，如何將另一個參數傳遞給回調函數或從回調中獲取其中一個值？

例如：我有我想要顯示（結果1和結果2）不同的結果兩個div，所以我想我需要或者
另一個值傳遞給像 GoogleMapDistance（YourLatLong，DestLatLong的GoogleMapDistance功能， TheDiv）
或
能夠在回調之外從外部獲取ResultStr document.getElementById（「Results1」）。innerHTML = ResultStr;
或
將innerHTM設置爲函數document.getElementById（「Results1」）的返回值。innerHTML = GoogleMapDistance（YourLatLong，DestLatLong）;

我被卡住了。我該怎麼做到這一點？現在看來，我只能運行一次所有代碼，並且只寫入一個div。

<div id="Results1"></div> 
<div id="Results2"></div> 

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
<script> 

function GoogleMapDistance(YourLatLong,DestLatLong) 
{ 
    var service = new google.maps.DistanceMatrixService(); 
    service.getDistanceMatrix(
    { 
    origins: [YourLatLong], 
    destinations: [DestLatLong], 
    travelMode: google.maps.TravelMode.DRIVING, 
    unitSystem: google.maps.UnitSystem.IMPERIAL, 
    avoidHighways: false, 
    avoidTolls: false 
    }, callback); 
} 

function callback(response, status) 
{ 
    if (status == google.maps.DistanceMatrixStatus.OK) 
    { 
    var origins = response.originAddresses; 
    var destinations = response.destinationAddresses; 
     for (var i = 0; i < origins.length; i++) 
     { 
      var results = response.rows[i].elements; 
      for (var j = 0; j < results.length; j++) 
      { 
       var element = results[j]; 
       var from = origins[i]; 
       var to = destinations[j]; 
       var distance = element.distance.text; 
       var duration = element.duration.text; 
       var ResultStr = distance + "&nbsp; (<i>" + duration + "</i>)"; 
      } 
     } 
    document.getElementById("Results1").innerHTML = ResultStr; 
    } 
} 

var YourLatLong = "45.4049,-122.797997"; 
var DestLatLong1 = "47.468893,-122.227978"; 
var DestLatLong2 = "61.221274,-149.831545"; 

GoogleMapDistance(YourLatLong,DestLatLong1); 

</script> 

Answer 1

你不能改變谷歌如何調用回調，但你可以讓它調用自己的本地函數作爲回調，然後有（通過關閉）調用另一個回調將像期望的額外的參數後這樣的：

function GoogleMapDistance(YourLatLong,DestLatLong, item) 
{ 
    var service = new google.maps.DistanceMatrixService(); 
    service.getDistanceMatrix(
    { 
    origins: [YourLatLong], 
    destinations: [DestLatLong], 
    travelMode: google.maps.TravelMode.DRIVING, 
    unitSystem: google.maps.UnitSystem.IMPERIAL, 
    avoidHighways: false, 
    avoidTolls: false 
    }, function(response, status) {callback(response, status, item)}); 
} 

或者，你可以只定義回調直列所以它直接訪問父函數變量：

function GoogleMapDistance(YourLatLong,DestLatLong, item) 
{ 
    var service = new google.maps.DistanceMatrixService(); 
    service.getDistanceMatrix(
    { 
    origins: [YourLatLong], 
    destinations: [DestLatLong], 
    travelMode: google.maps.TravelMode.DRIVING, 
    unitSystem: google.maps.UnitSystem.IMPERIAL, 
    avoidHighways: false, 
    avoidTolls: false 
    }, function callback(response, status) 
    { 
     // you can access the parent scope arguments like item here 
     if (status == google.maps.DistanceMatrixStatus.OK) 
     { 
     var origins = response.originAddresses; 
     var destinations = response.destinationAddresses; 
      for (var i = 0; i < origins.length; i++) 
      { 
       var results = response.rows[i].elements; 
       for (var j = 0; j < results.length; j++) 
       { 
        var element = results[j]; 
        var from = origins[i]; 
        var to = destinations[j]; 
        var distance = element.distance.text; 
        var duration = element.duration.text; 
        var ResultStr = distance + "&nbsp; (<i>" + duration + "</i>)"; 
       } 
      } 
     document.getElementById("Results1").innerHTML = ResultStr; 
     } 
    } 

)}