我如何重新使用Javascript變量函數

我試圖設置一個從瀏覽器所在位置向拉斯維加斯提供路線的地圖。這裏是我的代碼示例：我如何重新使用Javascript變量函數

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
<title>Google Maps API v3 Directions Example</title> 
<script type="text/javascript" 
     src="http://maps.google.com/maps/api/js?sensor=false"></script> 
</head> 
<body style="font-family: Arial; font-size: 12px;"> 
<div style="width: 600px;"> 
<div id="map" style="width: 280px; height: 400px; float: left;"></div> 
<div id="panel" style="width: 300px; float: right;"></div> 
</div> 

<script type="text/javascript"> 


navigator.geolocation.getCurrentPosition(GetLocation); 
function GetLocation(location) { 
var mylat = location.coords.latitude; 
var mylong = location.coords.longitude; 
} 


var directionsService = new google.maps.DirectionsService(); 
var directionsDisplay = new google.maps.DirectionsRenderer(); 

var map = new google.maps.Map(document.getElementById('map'), { 
    zoom:7, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

directionsDisplay.setMap(map); 
directionsDisplay.setPanel(document.getElementById('panel')); 

var request = { 
    origin: 'mylat,mylong', 
destination: '35.580789,-105.210571', 
    travelMode: google.maps.DirectionsTravelMode.DRIVING 
}; 

directionsService.route(request, function(response, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
    directionsDisplay.setDirections(response); 
    } 
}); 

</script> 
</body> 
</html>

如果我在mylat和mylong硬代碼，那麼該頁面將加載就好了。我也用了以下驗證時位置共享這些值正確填充：

function GetLocation(location) { 
var mylat = location.coords.latitude; 
var mylong = location.coords.longitude; 
document.write(mylat); 
document.write(mylong); 
}

我也試着寫功能之外這些變量，看看他們是突然空。我可以嘗試保留mylat和mylong變量並重新調用origin: 'mylat,mylong',調用？謝謝你的建議。

來源

2014-01-11 Presto

這些是函數範圍內的私有變量。使它們成爲全局函數或返回函數。 –

這不起任何作用，同樣，警告mylat和mylong不起作用：http://jsfiddle.net/t7txk/ –

這個工作對我來說： - 座標返回

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
<title>Google Maps API v3 Directions Example</title> 
<script type="text/javascript" 
     src="http://maps.google.com/maps/api/js?sensor=false"></script> 
</head> 
<body style="font-family: Arial; font-size: 12px;"> 
<div style="width: 600px;"> 
<div id="map" style="width: 280px; height: 400px; float: left;"></div> 
<div id="panel" style="width: 300px; float: right;"></div> 
</div> 

<script type="text/javascript"> 

var directionsService = new google.maps.DirectionsService(); 
var directionsDisplay = new google.maps.DirectionsRenderer(); 

var map = new google.maps.Map(document.getElementById('map'), { 
    zoom:7, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 

navigator.geolocation.getCurrentPosition(GetLocation); 
function GetLocation(location) { 
var mylat,mylong,request; 
mylat= location.coords.latitude; 
mylong = location.coords.longitude; 
request = { 
    origin: mylat+','+mylong, 
destination: '35.580789,-105.210571', 
    travelMode: google.maps.DirectionsTravelMode.DRIVING 
}; 

directionsDisplay.setMap(map); 
directionsDisplay.setPanel(document.getElementById('panel')); 
directionsService.route(request, function(response, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
    directionsDisplay.setDirections(response); 
    } 
}); 
} 

</script> 
</body> 
</html>

來源

2014-01-11 22:12:17

這是行得通的，但它與將變量聲明移動到更高範圍無關，並且與處理回調中的所有內容有關。你的建議混淆了這兩者。 –

很多很好的答案。我試過你，它適合我的需求。謝謝。 – Presto

@lwburk感謝您指出了這一點。正如您在下面詳細解釋的那樣，問題是ayscn調用。我已經編輯了答案，並提出瞭解決方案。 –

將它們向上移動一級，在功能之外。

閱讀關於JavaScript的變量範圍：

http://www.mredkj.com/tutorials/reference_js_intro_ex.html

您也可以用你的函數返回它們，當你把它取回。

來源

2014-01-11 22:04:50

這並不能解決問題，因爲'GetLocation'仍然是異步執行的。 –

設定方向後，您定義的功能範圍內mylat，mylong變量。所以他們只能在這個函數中訪問。

你應該定義變量之外的功能，例如：

var mylat, 
    mylong; 

function GetLocation(location) { 
    mylat = location.coords.latitude; 
    mylong = location.coords.longitude; 
} 

navigator.geolocation.getCurrentPosition(GetLocation);

更多有關變量的作用域 - http://msdn.microsoft.com/en-us/library/bzt2dkta(v=vs.94).aspx

來源

2014-01-11 22:17:59 NeReVaR

這並不能解決問題，因爲'GetLocation'仍然是異步執行的。 –

有正在這裏混淆真正的兩個問題。 第一個，JavaScript中的變量被限定爲聲明函數的範圍，這就是爲什麼mylat和myLong僅在GetLocation內可見。

第二個，GetLocation函數是一個異步執行的回調函數。也就是說，在文本源代碼下面出現的代碼實際上將在之前運行該函數的主體被執行。這很好 - 只要在GetLocation回調本身內執行依賴這些值的所有操作（在其調用的某些其他函數中），就沒有必要將變量聲明移到函數之外。就像這樣：

來源

2014-01-11 22:19:17

感謝您對此進行深入審查。 – Presto

我如何重新使用Javascript變量函數

回答

相關問題