如何将 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 的目的是不必要的，因为您将以任何一种方式离开页面。您实际上在做的是将变量发布到页面，然后当发生这种情况时，您将转到该页面，但操作顺序变成如下所示：POST多变的成功离开当前页面该POST变量基本上会在您当前的进程中丢失，因为这就像您通过转到其他页面来引起刷新。使用 AJAX 的巨大优势之一及其主要目的是您可以刷新页面上的内容而不会导致重新加载。否则，为什么不简单地使用一个<form>元素呢？<form action="welcome.php" method="post">&nbsp; &nbsp; <!-- form content --></form>或者解析变量的函数GET？<script>function sendNameAsGET(name="Jay") {&nbsp; &nbsp; window.location = "welcome.php?name="+name+";}</script>但是，如果您打算在不离开页面的情况下刷新页面内容，那么您的处理方式是错误的。您需要考虑的是拥有一个可以将内容加载到其中的容器。例如：<div id="ajaxDiv"></div>如果这是你的容器，你可以有一个加载静态内容的 AJAX 函数（或者直接添加它）。将内容加载到容器的方法是使用.html();带有我们选择的选择器的函数。例子：$( document ).ready(function() {&nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; type : "GET",&nbsp; &nbsp; &nbsp; &nbsp; url : "some-static-content.php",&nbsp; &nbsp; &nbsp; &nbsp; data : { /* data if necessary */ },&nbsp; &nbsp; &nbsp; &nbsp; success: function (html) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $("#ajaxDiv").html(html);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; })});在上面的示例中，我们将名为some-static-content.php的页面的 HTML 内容加载到具有id ajaxDiv的容器中。使用 AJAX 的另一个很好的理由是您现在可以将您的内容组织到不同的文件中，这使得拥有一个非常整洁的结构变得容易得多。“哦，如果我需要编辑这个特定的内容，我只是去/this/directory/and-this-file.php”。无需进入一个文件，滚动浏览数千行代码即可找到您的部分。它变得很像积木或乐高积木，您可以动态互换以满足您的需要。并使用welcome.php文件中的 HTML 更改容器的内容，而不刷新页面：$.ajax({&nbsp; &nbsp; type : "POST",&nbsp; &nbsp; url: "welcome.php",&nbsp; &nbsp; data: { name : "Jay" },&nbsp; &nbsp; success: function (html) {&nbsp; &nbsp; &nbsp; &nbsp; //Success handling&nbsp; &nbsp; &nbsp; &nbsp; console.log("success");&nbsp; &nbsp; &nbsp; &nbsp; $('#ajaxDiv').html(html);&nbsp; &nbsp; }});现在ajaxDiv容器将从welcome.php加载您的新内容，您将能够使用您的POST变量。如果您在welcome.phpecho中输出变量，那么这将是现在显示在ajaxDiv容器中的内容，而不是some-static-content.php的旧内容。POST

Answer 2

编辑：添加了第五点。这里面有几件事正在发生。让我们考虑一下推理。一：如果你只是要去页面，为什么要发送数据？看起来帖子在发送时变得混乱，然后转到没有它价值的页面。它在想“嘿，现在成功了，让我转到没有价值的页面。” 最好的解释方式就像您再次重新提交表单一样。二：为什么需要 Ajax？如果您的欢迎页面要做一些特定的事情，就像上面的例子一样，为什么您需要 JS？你不能让你的表格转到那个页面吗？喜欢<form action="welcome.php" method="post">帖子通常与表单相关，与发送数据无关。三：这会变得令人费解。我会再次调查你为什么这样做，因为这不是最好的。我会将结果设为 cookie，然后重定向到页面，并将变量设置为该 cookie。$.ajax({&nbsp; &nbsp; url: "welcome.php",&nbsp; &nbsp; type: "POST",&nbsp; &nbsp; data: {name:"Jay"},&nbsp; &nbsp; success: function (result) {&nbsp; &nbsp; &nbsp; &nbsp; console.dir(result); // then we can find out everything about our result&nbsp; &nbsp; &nbsp; &nbsp; document.cookie = "cookiename=result.name"&nbsp; &nbsp; &nbsp; &nbsp; window.location = "welcome.php";&nbsp; &nbsp; }});五：好的，让我们在 welcome.php 上再看一遍（我只是在做其他事情时想到了这一点）在我们将值发送到 php 页面后，我们可以创建一个会话或 php cookie。JS 可以保持不变$.ajax({&nbsp; &nbsp; url: "welcome.php",&nbsp; &nbsp; type: "POST",&nbsp; &nbsp; data: {name:"Jay"},&nbsp; &nbsp; success: function (result) {&nbsp; &nbsp; &nbsp; &nbsp; console.dir(result);&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; // then we can find out everything about our result&nbsp; &nbsp; &nbsp; &nbsp; window.location = "welcome.php";&nbsp; &nbsp; }});欢迎原谅我的 php 有点生疏<?phpif(isset($_POST["name"])) {&nbsp; &nbsp; session_start();&nbsp; &nbsp; $_SESSION["sessionName"]=$_POST["name"];}if (isset($_SESSION["sessionName"])) {&nbsp; &nbsp; echo $_SESSION["sessionName"];else {&nbsp; &nbsp; echo "something went wrong";}?>