2017-07-09 13 views
0

ジオロケーションAPIを使用していて、ボタンをクリックするとユーザーの場所の経度が表示されるonclickイベントを設定しようとしています。私のonclick関数は、私の関数が私がそれを呼び出していなくてもロードされているように思われるので動作しません。私はちょうど私が間違っているのかわからないのですJavaScript onloadクリックイベント

navigator.geolocation.getCurrentPosition(showLocation); 
 

 
function showLocation(position) { 
 
    var currPosLat = position.coords.latitude; 
 
    document.getElementById("info").innerHTML = "latitude: " + currPosLat; 
 
}

:JavaScriptのコード

<!DOCTYPE html> 
 
<html lang="en"> 
 
    <head> 
 
     <link href="style.css"> 
 
     <title> 
 
     </title> 
 
     <!--<script src="modernizr.custom.64298.js"></script>--> 
 
    </head> 
 

 
    <body> 
 
     <button onclick="showLocation()">Click</button> 
 
     <p id="info"></p> 
 
     <script src="script.js"></script> 
 
    </body> 
 
</html>

。私の緯度は、クリックしなくても私のinnerHTMLにロードされているだけです。クリックボタンを使用すると、coordsはundefinedと表示されます。

答えて

1

あなたのコードはnavigator.geolocation.getCurrentPosition(showLocation);

で始まるこれは、すぐに.jsファイルがロードされているとして、それがすぐに実行理由であるshowLocation関数を呼び出します。

あなたがする必要があるすべてのあなたのonclickに次の行を移動し、それが動作しますです。

<button onclick="navigator.geolocation.getCurrentPosition(showLocation)">Click</button> 

とスクリプトが

function showLocation(position) { 
    var currPosLat = position.coords.latitude; 
    document.getElementById("info").innerHTML = "latitude: " + currPosLat; 
} 
だけshowLocation機能である:

だからあなたのボタンになります

+0

ありがとうございますJeff私は2分でこのコメントを受け入れます。ヘルプメイトを感謝します。 – user8280738

+0

ありがとうございましたJeffの新しいメソッドは、もっと単純な感謝の仲間のようです。 – user8280738

関連する問題