如何将 JQuery.Ajax() 发送到 PHP

Question

我正在尝试将一些 Ajax 数据发布到我的 PHP 应用程序（使用 XAMPP），但无法弄清楚为什么我不能在服务器端（在浏览器中）“回显”该值。

我有我的客户端：localhost:8080/test/test.html，看起来像这样：

<script>
$.ajax({
    url: "welcome.php",
    type: "POST",
    data: {name:"Jay"},
    success: function (result) {
        console.log("success");
        window.location = "welcome.php";
    }
});                                                         
</script>

我在http://localhost:8080/test/welcome.php 上也有我的 PHP 脚本：

<?php
    if(isset($_POST["name"]))
        echo $_POST["name"];
    else
        echo "something went wrong";
 ?>

似乎$_POST["name"] 未定义，因为else 已执行。但它不应该呼应'Jay​​'吗？

我查看了类似的 stackoverflow 问题/答案，但我似乎无法弄清楚出了什么问题。我已将 $_POST 更改为 $_REQUEST，我已将 echo 更改为 print_r，甚至更改为 var_dump。似乎没有任何效果。我添加了数据类型：'json'，输入内容类型，将 json 键更改为字符串等。

当我在执行 test.html 后查看 Chrome 的“开发工具”时，我可以在“网络”选项卡中看到带有 name:jay 的表单数据。所以我不确定是怎么回事....

任何帮助都会非常感激。

谢谢:)

Answer 1

在您的情况下，您使用 AJAX 是不必要的，因为您以任何一种方式离开页面。您实际上所做的是将变量发布到页面，然后当发生这种情况时，您会转到该页面，但操作顺序会变成这样：

1. POST变量
2. 成功
3. 离开当前页面

POST 变量基本上会在您当前的进程中丢失，因为这就像您通过转到另一个页面来导致刷新一样。

使用 AJAX 的一个巨大优势以及它的真正主要目的是，您可以刷新页面上的内容而不会导致重新加载。否则，为什么不简单地使用 <form> 元素呢？

<form action="welcome.php" method="post">
    <!-- form content -->
</form>

或者解析GET变量的函数？

<script>
function sendNameAsGET(name="Jay") {
    window.location = "welcome.php?name="+name+";
}
</script>

但是，如果您打算在不离开页面的情况下刷新页面的内容，那么您就走错了路。您需要考虑的是拥有一个可以将内容加载到其中的容器。

例如：

<div id="ajaxDiv"></div>

如果这是您的容器，您可以拥有一个加载静态内容的 AJAX 函数（或直接添加它）。将内容加载到容器的方法是使用 .html(); 函数和我们选择的选择器。

例子：

$( document ).ready(function() {
    $.ajax({
        type : "GET",
        url : "some-static-content.php",
        data : { /* data if necessary */ },
        success: function (html) {
            $("#ajaxDiv").html(html);
        }
    })
});

在上面的示例中，我们将名为 some-static-content.php 的页面的 HTML 内容加载到具有 id ajaxDiv 的容器中。

使用 AJAX 的另一个很好的理由是，您现在可以将内容组织成不同的文件，从而更容易拥有非常整洁的结构。 “哦，如果我需要编辑这个特定的内容，我就去 /this/directory/and-this-file.php”。无需进入一个文件，滚动数千行代码即可找到您的部分。它变得很像积木或乐高积木，您可以动态交换以满足您的需求。

使用 welcome.php 文件中的 HTML 更改容器的内容，而不刷新页面：

$.ajax({
    type : "POST",
    url: "welcome.php",
    data: { name : "Jay" },
    success: function (html) {
        //Success handling
        console.log("success");
        $('#ajaxDiv').html(html);
    }
});

现在 ajaxDiv 容器将从 welcome.php 加载您的新内容，您将能够使用您的 POST 变量。如果您在 welcome.php 中 echo 出 POST 变量，那么这将是 ajaxDiv 容器中现在显示的内容，而不是旧的 some-static-content.php.

Answer 2

编辑：添加了第五点。

这有几件事情发生。让我们考虑一下推理。

一：如果你只是要去页面，为什么要发送数据？看起来帖子在发送然后转到没有价值的页面时变得混乱。它在想“嘿，现在成功了，让我去没有价值的页面。”最好的解释方式就像您重新提交表单一样。

二：为什么为此需要 Ajax？

如果你的欢迎页面要做一些特定的事情，比如上面的例子，你为什么需要 JS？难道你不能让你的表格进入那个页面吗？喜欢

<form action="welcome.php" method="post">

帖子通常与表单相关，与发送数据无关。

三：这会变得令人费解。我会再次调查你为什么这样做，因为这不是最好的。

我会将结果设为 cookie，然后重定向到页面，并将变量设置为该 cookie。

$.ajax({
    url: "welcome.php",
    type: "POST",
    data: {name:"Jay"},
    success: function (result) {
        console.dir(result); // then we can find out everything about our result
        document.cookie = "cookiename=result.name"
        window.location = "welcome.php";
    }
});

五：好的，让我们在welcome.php上再看一遍（我只是在做别的事情时想到了这个）

将值发送到 php 页面后，我们可以创建会话或 php cookie。

JS 可以保持不变

$.ajax({
    url: "welcome.php",
    type: "POST",
    data: {name:"Jay"},
    success: function (result) {
        console.dir(result); 
        // then we can find out everything about our result
        window.location = "welcome.php";
    }
});

欢迎原谅我的 php 有点生疏

<?php

if(isset($_POST["name"])) {
    session_start();
    $_SESSION["sessionName"]=$_POST["name"];
}


if (isset($_SESSION["sessionName"])) {
    echo $_SESSION["sessionName"];
else {
    echo "something went wrong";
}

?>