让地理位置与JQM /电话差距一起使用

时间:2013-10-15 21:07:06

标签: jquery-mobile cordova

我有一个使用phonegap和jQM的应用程序。我正在尝试让我的地理位置在单击按钮时工作,但我在控制台中收到错误,说明地理位置未定义。 该错误指向onclick =“getLocation()”。有人可以帮帮我吗?

以下是我的代码示例:

  <div data-role="page" id="geo" data-add-back-btn="true" onload="onBodyLoad()">
        <header data-role="header" data-position="fixed">
            <h1>Geolocation</h1>
        </header>
        <div data-role="content">
            <button data-role="button" onclick="getLocation()">Click to get your current position</button>

            <div id="mapholder"></div> 
        </div> 

    </div>


$("#geo").on('pageinit', function () {
console.log("Geo page loaded!");

function onBodyLoad(){      
    document.getElementById('geolocation').empty();
    document.addEventListener("deviceready", onDeviceReady, false);
}

function onDeviceReady(){
     phoneGapReady.innerHTML = ("")
}

var x=document.getElementById("demo");

    function getLocation() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition,showError);
        }else {
            x.innerHTML="Your Browser does not support Geolocation.";}
    }
    function showPosition(position) {
        lat=position.coords.latitude;
        lon=position.coords.longitude;
        latlon=new google.maps.LatLng(lat, lon);
        mapholder=document.getElementById('mapholder')
        mapholder.style.height='250px';
        mapholder.style.width='100%';

        var myOptions= {
            center:latlon,zoom:14,
            mapTypeId:google.maps.MapTypeId.ROADMAP,
            mapTypeControl:false,
            navigationControlOptions:
            {style:google.maps.NavigationControlStyle.SMALL}
        };

        var map = new
            google.maps.Map(document.getElementById("mapholder"),myOptions);
        var marker=new
            google.maps.Marker({position:latlon,map:map,title:"Your Location."});
      }

      function showError(error)
      {
          switch(error.code) 
          {
              case error.PERMISSION_DENIED:
              x.innerHTML="User did not allow Geolocation."
              break;
              case error.POSITION_UNAVAILABLE:
              x.innerHTML="Location Data is not Available."
              break;
              case error.TIMEOUT:
              x.innerHTML="Request Timed Out."
              break;
              case error.UNKNOWN_ERROR:
              x.innerHTML="Unknown Error."
              break;
          }
      }

});

1 个答案:

答案 0 :(得分:0)

假设您正在使用Phonegap 3.x,请确保已将geolocation插件添加到项目中:

phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-geolocation.git

确保config.xml包含它:

<feature name="Geolocation">
    <param name="android-package" value="org.apache.cordova.GeoBroker" />
</feature>

确保您在Android清单中允许访问:

<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />

尝试更改

if (navigator.geolocation) {

if (typeof(navigator.geolocation) != "undefined") {