【问题标题】:How to store the latitude and longitude in mysqli database如何在mysqli数据库中存储经纬度
【发布时间】:2018-03-24 17:41:57
【问题描述】:

我想存储这段 javascript 代码中的纬度和经度值

function initialize() {
    var myLatlng = new google.maps.LatLng(26.329086,50.227570);
    var myOptions = {
        zoom:12,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("gmap"), myOptions);
    // marker refers to a global variable
    marker = new google.maps.Marker({
        position: myLatlng,
        map: map
    });
    // if center changed then update lat and lon document objects
    google.maps.event.addListener(map, 'center_changed', function () {
        var location = map.getCenter();
         document.getElementById("lat").innerHTML = location.lat();
        var lon = document.getElementById("lat").innerHTML;
        document.getElementById("lon").innerHTML = location.lng();


        // call function to reposition marker location
        placeMarker(location);
    });
    // if zoom changed, then update document object with new info
    google.maps.event.addListener(map, 'zoom_changed', function () {
        zoomLevel = map.getZoom();
        document.getElementById("zoom_level").innerHTML = zoomLevel;
    });
    // double click on the marker changes zoom level
    google.maps.event.addListener(marker, 'dblclick', function () {
        zoomLevel = map.getZoom() + 1;
        if (zoomLevel == 20) {
            zoomLevel = 10;
        }
        document.getElementById("zoom_level").innerHTML = zoomLevel;
        map.setZoom(zoomLevel);
    });

    function placeMarker(location) {
        var clickedLocation = new google.maps.LatLng(location);
        marker.setPosition(location);
    }
}
window.onload = function () { initialize() };

并通过span将值显示在html代码中

<div id="gmap">
<span id="lat"></span>
<span id="lon"></span>

当用户在地图上移动标记时,这些值会动态变化,我想将它们传递给将它们插入数据库的 php 代码。

【问题讨论】:

  • 您是否尝试通过 POST 将这些数据发送到您的 PHP 代码?

标签: javascript php html google-maps mysqli


【解决方案1】:

您可以使用 ajax/jquery 从 span 中获取信息并将数据发送到您的服务器进行保存(请注意,您可以使用纯 JavaScript 执行此操作,但需要更多代码,您的另一个选择是使用 @987654321 @提交方法)。

代码简介(未经测试):

(点击或超时功能)

var formdata="lat="+$('#lat').text()+'&lon='+$('#lon').text();

$.ajax({
  type: 'POST',
  url: 'save_location.php',
  data: formdata,
  async: false,
}).done(function(data) {
   alert(data)
});

希望这有助于您入门。

【讨论】:

  • 感谢您的回复,但您的意思是使用 $("submit").click(function(){} 还是将代码放在函数中,并将 onClick 放在
  • 这两种方法都可以使用,具体取决于您要执行的操作:1) 如果您想连续跟踪位置,请使用 setTimeout 函数,该函数每隔几秒重复一次并将数据发送到服务器。 .. 2) 或者您可以在鼠标移动时进行 ajax 调用... 3) 鼠标点击等...只需搜索这个论坛所有的答案。
【解决方案2】:

我认为你已经得到了部分答案。你问过,“我如何通过 $_POST$_GET 处理服务器内部的请求” var formdata="lat="+$('#lat').text()+'&lon='+$('#lon').text();

我将分享上面的代码来完成你的答案。如果您的表单有和 id 属性 target_form 然后使用下面的代码

 $( "#target_form" ).submit(function( ) {
     $.ajax({
          type: 'POST',
          url: 'save_location.php',
          data: formdata, //we are passing lat and lon to server
          async: false,
        }).done(function(data) {
           alert(data)
        });
  });

所以转到您的 save_location.php 文件并通过 isset 函数检查它以跳过不需要的错误,例如

if(isset($_POST['lat'])){
  $lat = $_POST['lat'];
  $lat = $_POST['lat'];

  //and save it to server by **mysqli**  or **pdo**
  echo "success";
}

【讨论】:

  • 它仍然没有设置,它向$lat显示一个未定义的变量错误。
【解决方案3】:

所以你可以使用

$( "#target_form" ).submit(function( ) {
    var lat = "7847.343"; //garbage data
    var lon = "85.125"; //garbage data

     $.ajax({
          type: 'POST',
          url: 'save_location.php',
          data: {
               "lat": lat,
               "lon": lon
            } //we are passing lat and lon to server
          async: false,
        }).done(function(data) {
           alert(data)
        });
  });

【讨论】:

    猜你喜欢
    • 2010-11-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-12-01
    • 1970-01-01
    • 2011-09-05
    • 1970-01-01
    相关资源
    最近更新 更多