检查地理位置后功能无法启动

巴特·S。

我正在构建一个小型Web应用程序,该应用程序将使用表单输入(名称)+用户的地理位置,并将其放入localstorage数组中。我是JS的新手,但是我已经掌握了完整的名称。我现在正尝试将其扩展到在用户按下Submit时纬度+经度存储在localstorage数组中的程度,但是执行该功能的功能将无法启动/设置。

window.onload = function() {

// Read value from storage, or empty array
var names = JSON.parse(localStorage.getItem('locname') || "[]");
var lat = JSON.parse(localStorage.getItem('latitude') || "[]");
var long = JSON.parse(localStorage.getItem('longitude') || "[]");

function initCoords() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(saveData);
    console.log('This works');
  } else {
    showError("Your browser does not support Geolocation!");
  }
}

function saveData(data){
  console.log('But does it get here?');
  //Push Users Input value
  var data = document.getElementById("locationName").value;
  names.push(data);
  localStorage.setItem('locname', JSON.stringify(names));

  //Push Latitude
  var latitude = position.coords.latitude;
  lat.push(latitude);
  localStorage.setItem('latitude', JSON.stringify(latitude));

  //Push Longitude
  var longitude = position.coords.longitude;
  long.push(longitude);
  localStorage.setItem('longitude', JSON.stringify(longitude));
  }

document.querySelector('#saveData').onclick = initCoords;
} 

我有一个ID为saveData的按钮。我的该脚本没有地理定位的早期版本运行良好,在那里我通过单击按钮启动了saveData函数。在这种情况下,我首先要检查用户是否具有可用的地理位置,因此我创建了initCoords函数。

我试图使用控制台日志来查看我的函数在哪里结束,但是它在某种程度上无法到达saveData中的“但是到达这里了”。

阿德内

我想你的问题是这个

我有一个ID为saveData的按钮

您也有一个具有该名称的函数

function saveData(data){ ....

如果该函数位于全局范围内,则将其设置为window.saveData,然后当具有该ID的元素位于该函数之后时,浏览器将这些元素作为ID存储在window对象上,因此它将window.saveData作为元素存储并覆盖该函数。

解决方案是更改函数名称或元素ID。

编辑:

这里还有一些问题:

您没有在position任何地方声明,而是将其data作为回调的参数

function saveData(data){
  var data = document.getElementById("locationName").value;
  ....

那没有任何意义,你可能是说

function saveData(position){
  var data = document.getElementById("locationName").value;
  ....

事实是,您将位置对象中的数字存储在localStorage中,而不是数组中:

var latitude = position.coords.latitude;
  lat.push(latitude);
  localStorage.setItem('latitude', JSON.stringify(latitude));

看看如何将数据推送到lat,但您要保存的是纬度,数字而不是数组,所以下次您尝试将数字推送到非数组而不是数组时,您会得到一个错误,应该是

var latitude = position.coords.latitude;
  lat.push(latitude);
  localStorage.setItem('latitude', JSON.stringify(lat));

但是现在您已经将数字存储在localStorage中,因此在脚本中获得错误之前,您将得到一个错误,还必须清除localStorage,这可以在浏览器控制台中完成,或者这样

localStorage.removeItem('locname');
localStorage.removeItem('latitude');
localStorage.removeItem('longitude');

在开始尝试工作代码之前,您必须先清除一次此代码,该代码看起来应该像这样

window.onload = function () {

    localStorage.removeItem('locname');
    localStorage.removeItem('latitude');
    localStorage.removeItem('longitude');

    // Read value from storage, or empty array
    var names = JSON.parse(localStorage.getItem('locname') || "[]");
    var lat   = JSON.parse(localStorage.getItem('latitude') || "[]");
    var long  = JSON.parse(localStorage.getItem('longitude') || "[]");

    function initCoords() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(saveData);
            console.log('This works');
        } else {
            showError("Your browser does not support Geolocation!");
        }
    }

    function saveData(position) {
        var data = document.getElementById("locationName").value;
        names.push(data);
        localStorage.setItem('locname', JSON.stringify(names));

        var latitude = position.coords.latitude;
        lat.push(latitude);
        localStorage.setItem('latitude', JSON.stringify(lat));

        var longitude = position.coords.longitude;
        long.push(longitude);
        localStorage.setItem('longitude', JSON.stringify(long));

    }

    document.getElementById('saveData').onclick = initCoords;
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

检查地理位置后功能无法启动

来自分类Dev

地理位置功能参数的行为

来自分类Dev

20秒后获得地理位置

来自分类Dev

超时后关闭地理位置提示

来自分类Dev

使用地理位置更新标记位置后,无法在Leaflet中绘制

来自分类Dev

无法使用geoPointForCurrentLocationInBackground检索地理位置

来自分类Dev

地理位置API无法正常工作

来自分类Dev

检查圆形地理围栏内的地理位置(纬度,经度)

来自分类Dev

检查圆形地理围栏内的地理位置(纬度,经度)

来自分类Dev

检查一个地理位置是否在两个地理位置内

来自分类Dev

电报地理位置

来自分类Dev

gpsd的地理位置

来自分类Dev

角度地理位置

来自分类Dev

OrientDB地理位置

来自分类Dev

AngularJs地理位置

来自分类Dev

重置地理位置

来自分类Dev

地理位置脚本

来自分类Dev

地理位置配置

来自分类Dev

AppleScript - 地理位置

来自分类Dev

sencha touch地理位置在设备(iphone 5)上运行2-3次后无法获得当前位置

来自分类Dev

地理位置-如何检查2个圆圈是否重叠

来自分类Dev

使地理位置坐标可用于其他功能

来自分类Dev

我的“流星地理位置”功能出了点问题

来自分类Dev

Phonegap地理位置无法在移动设备上运行

来自分类Dev

无法使用地理位置显示自动缩放地图

来自分类Dev

无法在Android模拟器中获取地理位置

来自分类Dev

无法访问函数内部的地理位置

来自分类Dev

我的googlemap地理位置无法正常工作

来自分类Dev

无法添加Cordova 3.4.0地理位置插件