div不会在Calling watchLocation上更新

时间:2015-08-31 03:37:32

标签: javascript jquery html5 geolocation

以下是用于查找更新的地理位置的HTML5代码。纬度和经度值会在警告框中弹出。但是,无法使用 $(id).html(value); 将值分配给div。我正在使用watchPosition()函数。

   <html>
     <head>   
      <script type="text/javascript">
         var watchID;
         var geoLoc;

         function showLocation(position) {
            var latitude = position.coords.latitude;
            var longitude = position.coords.longitude;
            alert("Latitude : " + latitude + " Longitude: " + longitude);
             $("#lat").html(latitude);
             $("#long").html(longitude);
             }         

         function errorHandler(err) {
            if(err.code == 1) {
               alert("Error: Access is denied!");
            }

            else if( err.code == 2) {
               alert("Error: Position is unavailable!");
            }
         }

         function getLocationUpdate(){
            if(navigator.geolocation){
               // timeout at 60000 milliseconds (60 seconds)
               var options = {timeout:60000};
               geoLoc = navigator.geolocation;
               watchID = geoLoc.watchPosition(showLocation, errorHandler, options);
            }

            else{
               alert("Sorry, browser does not support geolocation!");
            }
         }
      </script>

   </head>
   <body>

      <form>
         <input type="button" onclick="getLocationUpdate();" value="Watch Update"/>
         Latitude : <div id="lat"></div>
         Longitude : <div id="long"></div>
       </form>


   </body>
</html>

1 个答案:

答案 0 :(得分:1)

当你使用alert()时,它会停止你的代码的所有进一步执行,所以将alert()移到你的行下面,将值赋给div,这应该可以解决你的问题。

$("#lat").html(latitude);
$("#long").html(longitude);
alert("Latitude : " + latitude + " Longitude: " + longitude);