通过ajax和jquery向php发送变量_Php_Jquery_Ajax_Variables_Geolocation

通过ajax和jquery向php发送变量

php jquery ajax variables geolocation

通过ajax和jquery向php发送变量,php,jquery,ajax,variables,geolocation,Php,Jquery,Ajax,Variables,Geolocation,我想通过html5地理定位请求用户地理定位，并将其发送到下一页有人告诉我必须使用ajax/jquery，所以这是我的代码： <form action="response.php"> <button onclick="getLocation()">Start</button> <script> function getLocation() { if (navigator.geolocation) { na

我想通过html5地理定位请求用户地理定位，并将其发送到下一页有人告诉我必须使用ajax/jquery，所以这是我的代码：

<form action="response.php">
        <button onclick="getLocation()">Start</button>

<script>

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(success, error);
    } else { 
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}

function successFunction(position) {
   var lat = position.coords.latitude;
   var longi = position.coords.longitude;

    $.ajax({
  type: "POST",
  url: "response.php",
  data: { latitude: lat, longitude: longi }
  }).done(function( msg ) {
  alert( "Data Saved: " + msg );
});
}
</script>
</form>

但是页面是空白的

请尝试以下操作：

index.html：

<html>
<head></head>
<body>
    <form action="response.php" method="post">
      <input type="hidden" id="latitude" name="latitude" value="" />
      <input type="hidden" id="longitude" name="longitude" value="" />
      <input type="submit" value="Start" />
    </form>
</body>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
    function getLocation() {

         var options = {
            enableHighAccuracy: true,
            timeout: 5000,
            maximumAge: 0
         };

        function success(pos) {
           successFunction(pos);
        };

        function error(err) {
            console.warn('ERROR(' + err.code + '): ' + err.message);
        };

        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(success, error,options);
        } else { 
            //x.innerHTML = "Geolocation is not supported by this browser.";
        }
    }

    function successFunction(position) {
       var lat = position.coords.latitude;
       var longi = position.coords.longitude;

        $('#latitude').val(lat);
        $('#longitude').val(longi);
    }
    getLocation();
</script>
</html>

<?php
    $latitude = $_POST["latitude"]; 
    $longitude = $_POST["longitude"]; 
    echo "Latitude:".$latitude."</br>";
    echo "longitude:".$longitude;
?>

函数getLocation（）{ if（导航器.地理位置）{ navigator.geolocation.getCurrentPosition（成功，错误）； }否则{ x、 innerHTML=“此浏览器不支持地理位置。”； } } 功能成功功能（位置）{ var lat=位置坐标纬度； var longi=位置坐标经度； $.ajax({ 类型：“POST”， url:“response.php”，数据：“data=“+”{“纬度”：“+lat+”，“经度”：“+longi+”}” }).done（函数（msg）{ 警报（“保存的数据：“+msg”）； }); } $location=json解码（preg\u replace（“/\\\”/”、“\\”、$\\\”、$\\\\\”、$POST['data']）；打印（位置）； $lat=$location->LATIONE； echo$lan=$location->longitude；

首先检查

var lat

var longi

中是否有任何值，您在控制台中遇到了什么错误？将您的函数名

successFunction

更改为

success

？您刚刚声明了您的函数。你在什么地方调用它吗？好吧，我将函数名更改为success，但仍然没有结果仍然有一个空白页：/i我现在感觉很愚蠢，对不起，伙计们：'（@Juloius）您在页面中加载jquery库了吗？是的，ofc，我想否则会有错误。那么您现在面临的问题是什么？检查您的控制台。问题：my response.php只是空白

<?php
    $latitude = $_POST["latitude"]; 
    $longitude = $_POST["longitude"]; 
    echo "Latitude:".$latitude."</br>";
    echo "longitude:".$longitude;
?>

/yourprojectdirectory/index.html
/yourprojectdirectory/response.php

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(success, error);
    } else { 
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}

function successFunction(position) {
   var lat = position.coords.latitude;
   var longi = position.coords.longitude;

    $.ajax({
  type: "POST",
  url: "response.php",
  data:"data="+ '{ "latitude":"'+ lat+'", "longitude": "'+longi+'" }'
  }).done(function(msg) {
  alert( "Data Saved: " + msg );
});
}
</script>




$location =json_decode( preg_replace('/\\\"/',"\"",$_POST['data'])); 
print_r($location);
 $lat=$location->latitude;
 echo $lan=$location->longitude;