无法使用 AJAX 将 JS 变量传递给 PHP

Posted 2023-02-23

【中文标题】无法使用 AJAX 将 JS 变量传递给 PHP

【英文标题】：Cannot pass JS variable to PHP using AJAX

【发布时间】：2017-10-01 20:16:46

【问题描述】：

我正在尝试获取用户的当前位置。

我有 JS 脚本来获取当前的纬度和经度，使用 AJAX 将 js 变量发送到 index.php。

$(document).ready(function() 
if ("geolocation" in navigator)
    navigator.geolocation.getCurrentPosition(function(position)
            var userLat = position.coords.latitude;
            var userLong = position.coords.longitude;
            console.log(userLong);
            console.log(userLat);

            $.ajax(
              type: 'POST',
              url: 'index.php',
              data: 
              userLat : userLat,
              userLong : userLong
              ,
              success: function(data)
                
                  console.log(data);

                

            );

    );
else
    console.log("Browser doesn't support geolocation!");
);

然后我尝试在我的 index.php 中执行此操作：

echo $_POST['userLat'];
echo $_POST['userLong'];

什么都没有出现。提前致谢。

【问题讨论】：

在你浏览器的调试工具中，控制台有没有报错？发出了哪些网络请求以及这些请求中包含哪些数据？调试时，是否进行了 AJAX 调用？服务器的响应究竟是什么？

它显示正确的输出：console.log(userLong);控制台.log(userLat);没有其他错误。同样对于控制台，日志（数据）它显示整个页面代码，我不知道为什么。

嗯，它显示了该 AJAX 请求返回的任何内容。如果index.php 返回整个页面，那么它将显示整个页面。您到底在哪里寻找 AJAX 值？你不是在检查控制台日志响应吗？

是的，我正在检查控制台输出的 index.php。就像我说的，它在控制台输出中显示了 userLong 和 userLat 的正确值，但是当 console.log(data) 被调用时，它显示了整个页面的代码，而不是使用 AJAX 发送的数据。我不确定为什么会这样。

"it shows correct values in console output" - 那么到底是什么问题呢？您正在登录控制台，仅此而已。正确的数据在控制台中。那么有什么问题呢？你期待会发生什么？它显示整个页面，因为这是您请求页面时响应中的内容。有什么理由不应该这样做吗？

【参考方案1】：

什么都没有出现。

那是正确你永远不会通过浏览 index.php 得到任何东西，因为此时没有 POST ，AJAX 是内部的，显示 index.php 结果的唯一方法是您从中发送 ajax 调用的页面。

此时：

success: function(data)
            
              console.log(data);

            

您可以控制在哪里显示来自 index.php 的数据，例如 alert(data) 或 document.getElementById("someelement").innerhtml=data; 等等。

【参考方案2】：

为 ajax 定义和返回 dataType 可能会有所帮助。

将此添加到您的ajax 选项列表中

 dataType: 'json',

然后在 index.php 中编码并回显一个 json 字符串。删除线

echo $_POST['userLat'];
echo $_POST['userLong'];

替换为

echo json_encode($_POST);

成功函数中的console.log(data); 应该显示一个包含两个项目的对象：“userlat”和“userLong”以及每个项目的关联值。或者如果$_POST 有这两个项目，它应该。

如果您想要更新浏览器屏幕，您必须使用 data 并使用它来修改 DOM。

【讨论】：

现在我的 AJAX 代码如下所示： $.ajax( type: 'POST', url: 'index.php', dataType: 'json', data: userLat : userLat, userLong : userLong , 成功：function(data) console.log(data); );在 index.php 我有 echo json_decode('$_POST');仍然没有“回显”任何东西和 console.log(data) 的控制台日志；现在是空的。

应该是json_encode，而不是json_decode。另外，删除$_POST 周围的单引号。使用这个echo json_encode($_POST);

处理 ajax 请求的函数中的 echo 不会发送到浏览器输出。它被发送到您的 ajax 语句的 success 函数。