Javascript中的Ajax POST - 缺少数据

时间:2018-01-06 19:52:02

标签: javascript php post

这是我正在尝试做的事情:

我有一个需要地理定位数据的php脚本。我在加载时执行javascript以确定我的坐标并使用ajax / jQuery我发布这些结果(lat和long)。

$.ajax({
    type: 'POST',
    url: 'index.php',
    data: {
        lat: latitude,
        long: longitude
    },
    success: function( data ) {
       console.log( data );
    }
});

该脚本有效,但是,我没有在浏览器中获取坐标。 javascript控制台显示正确的结果。奇怪的是,如果我这样做:

$lat = $_POST['lat'];
$lon = $_POST['long'];

$handle = "/tmp/fish";
$mode = "w";
$fp = fopen($handle, $mode);
fwrite($fp,$lat);
fwrite($fp,',');
fwrite($fp,$lon);   
fclose($fp);

该文件也将具有正确的坐标结果。如果我这样做:

echo $_POST['lat'];

它将是空的。所以我可以通过文件I / O来实现它,但我宁愿在脚本中处理它。在上面的文件I / O之后,我必须通过表单操作执行第二个php脚本来打开文件并获取我需要的数据。 我错过了什么?

这是一个例子: HTML:

print "<pre>";
print_r($_POST);
print "</pre>";
    Array
    (
    )

控制台:

<pre>Array
(
    [lat] => 40.####
    [long] => -82.####
)
</pre>

整个javascript:

<script type="text/javascript">
function geoFindMe() {
  var output = document.getElementById("out");
  function success(position) {
    var latitude  = position.coords.latitude;
    var longitude = position.coords.longitude;  

    $.ajax({
        type: 'POST',
        url: 'index.php',
        data: {
            lat: latitude,
            long: longitude
        },
        success: function( data ) {
           console.log( data );
           $("#lat").html(data['lat']);
           $("#long").html(data['long']);
           $("#lat").html("<b>" + data['lat'] + "</b>");

        }
    });
    function error() {
output.innerHTML = "Unable to retrieve your location";      
 }
  navigator.geolocation.getCurrentPosition(success, error);

}

</script>

现在我尝试了@Bradmage的建议。代码:

$lat = $_POST['lat'];
$lon = $_POST['long'];

$handle = "/tmp/fish";
$mode = "w";
$fp = fopen($handle, $mode);
fwrite($fp,$lat);
fwrite($fp,',');
fwrite($fp,$lon);   
fclose($fp);
cat fish
40.xxxxx,-82.xxxx

数据在文件中,我做了我的fclose。然后:

$mode = "r";
$t = fopen($handle, $mode);
$r = fgetcsv($t, 1000, ",");
$r = print_array($r);
$lat = $r[0];
$long = $r[1];

$ r [0]和$ r [1]为空。如果我让我的表单操作另一个PHP脚本,我在上面读取,我得到数据。我完全难过了。

2 个答案:

答案 0 :(得分:0)

如果您的控制台显示正确的值,那么它们将被正确传回。您需要的是更多代码来更新您的页面。

说你必须要素:

<div id="lat"></div>
<div id="long"></div>`

console.log( data );下你需要像......

$("#lat").html(data['lat']);
$("#long").html(data['long']);

然后,您可以将两个div放在您希望数字显示在页面上的任何位置。

修改

如果你不熟悉jQuery,如果你使用.ajax,我假设你使用jQuery,这是一些jQuery的基础知识。

$(“”)获取一个对象。

#lat是元素ID。

.html()将html放在由$(“#lat”)检索的元素中。所以你可以使用$("#lat").html("<b>" + data['lat'] + "</b>");

答案 1 :(得分:0)

很快的模型。这会将坐标添加到表单中,因此您只需要将所有数据以一种形式提交一次。

<head>
<script>
$(document).ready(function(){
    var latitude  = position.coords.latitude;
    var longitude = position.coords.longitude;

    $("#lat").val(latitude);
    $("#long").val(longitude);
});
</script>
</head>
<body onload="geoFindMe()">

<form action="..">
    <input type="text" name="var1">
    <input type="text" name="var2">
    <input type="hidden" id="lat" name="lat" />
    <input type="hidden" id="long" name="long" />

    <input type="submit" />
</form>

</body>

现在你的脚本将拥有一切。

<?php
    $var1 = $_POST[...];
    $var2 = $_POST[...];
    $lat = $_POST['lat'];
    $lon = $_POST['long'];

    $handle = "/tmp/fish";
    $mode = "w";
    $fp = fopen($handle, $mode);
    fwrite($fp,$var1);
    fwrite($fp,',');
    fwrite($fp,$var2);
    fwrite($fp,',');
    fwrite($fp,$lat);
    fwrite($fp,',');
    fwrite($fp,$lon);   
    fclose($fp);