2012-03-31 79 views
0
<script> 
navigator.geolocation.getCurrentPosition(show_position); 
//This function does the work of getting the actual user coordinates 
function show_position(position){ 

var lat = position.coords.latitude; 
var longi = position.coords.longitude; 
var tick = position.timestamp; 

document.getElementById("Coord1").innerHTML=lat; 
document.getElementById("Coord2").innerHTML=longi; 

} 
</script> 

<p>Your Latitude is: <b id="Coord1" style="color:blue;"> </b></p> 
<p>Your Longitude is: <b id="Coord2" style="color:blue;"> </b> </p> 

大家好,的Javascript HTML5位置按鈕

我試圖運行這段代碼,它似乎正常工作。但是,是否可以創建一個運行navigator.geolocation.getCurrentPosition(show_position);的JavaScript按鈕?我有一個搜索框,我想在它旁邊有一個按鈕,當用戶點擊它時,它會自動填充空白框然後搜索。不知道這是否可能。

由於提前,

回答

0

你可以在點擊事件

x$("#btnInit").click(loadDemo); 
    //run the function 
    function loadDemo() { 
navigator.geolocation.getCurrentPosition(show_position); 
//This function does the work of getting the actual user coordinates 
function show_position(position){ 

var lat = position.coords.latitude; 
var longi = position.coords.longitude; 
var tick = position.timestamp; 

document.getElementById("Coord1").innerHTML=lat; 
document.getElementById("Coord2").innerHTML=longi; 

} 
} 

運行navigator.geolocation我一個使用xuijs因此X $在按鈕的前面。它與document.getElementById(「btnInit」)相同

然後在頁面上有一個id爲btnInit的按鈕。

0
<script>  
document.getElementById('getPositionBtn').addEventListener('click', function() { 
    navigator.geolocation.getCurrentPosition(function(position) {   
     document.getElementById("Coord1").innerHTML=position.coords.latitude; 
     document.getElementById("Coord2").innerHTML=position.coords.longitude; 
    }); 
}); 
</script> 

<p>Your Latitude is: <b id="Coord1" style="color:blue;"> </b></p> 
<p>Your Longitude is: <b id="Coord2" style="color:blue;"> </b> </p><br> 
<button id="getPositionBtn">Get Position!</button>