ajax 提交表单为什么它不能回显 $_POST答案

【问题标题】：ajax submit form why it cannot echo $_POSTajax 提交表单为什么它不能回显 $_POST
【发布时间】：2017-01-11 11:33:08
【问题描述】：

我正在使用 ajax 提交表单进行测试（提交给自己的页面“new1.php”）

我想要的是，点击提交按钮后，它会回显名字和姓氏。但是我不知道为什么我在提交后看不到名字和姓氏。

这里是new1.php页面

<?php 
echo $_POST['firstname']."<br>";
echo $_POST['lastname']."<br>"; 
 ?>  

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

</head>
<body>
    <form id="myform" action="new1.php" method="post">
        Firstname : <input type="text" name="firstname"> <br>
        Lastname : <input type="text" name="lastname"> <br>
        <input type="submit" value="Submit">
    </form>

        <script>
        // this is the id of the form
$("#myform").submit(function(e) {

    $.ajax({
           type: "POST",
           url: 'new1.php',
           data: $("#myform").serialize(), // serializes the form's elements.
           success: function(data)
           {
               alert('yeah'); // show response from the php script.
           }
         });

    e.preventDefault(); // avoid to execute the actual submit of the form.
});
    </script>
</body>
</html>

【问题讨论】：

拳头还是名字？检查您的元素名称以及您要回显的内容
您需要在控制台中签入。您的代码运行良好。
控制台没有错误
当您的页面加载时，您将无法看到名字和姓氏，因为它首先被解析。如果您需要显示它，您需要在表单中有一个隐藏字段，并在表单成功后将值粘贴到 js 中的隐藏变量
请转至inspect elements 转至network 在这里您可以看到new1.php 页面名称左侧单击并查看那里可能找到的回声。

标签： javascript php jquery html ajax

【解决方案1】：

在您的情况下，最好的选择是在您的 PHP 代码中使用 json_encode 以 JSON 格式检索值，然后通过数据对象访问这些值。

例子：

PHP 代码：

if($_POST)
{
    $result['firstname'] = $_POST['firstname'];
    $result['lastname'] = $_POST['lastname'];

    echo json_encode($result);
    die(); // Use die here to stop processing the code further 
}

JS代码：

$("#myform").submit(function (e) {

    $.ajax({
        type : "POST",
        url : 'new1.php',
        dataType : 'json', // Notice json here
        data : $("#myform").serialize(), // serializes the form's elements.
        success : function (data) {
            alert('yeah'); // show response from the php script.
            // make changed here
            $('input[name="firstname"]').text(data.firstname);
            $('input[name="lastname"]').text(data.lastname);
        }
    });

    e.preventDefault(); // avoid to execute the actual submit of the form.
});

【讨论】：

【解决方案2】：

当您使用表单作为序列化时，您必须像这样检索。

像这样编辑你的 ajax：

data: { formData: $("#myform").serialize()},

然后你可以在你的控制器中这样检索：

parse_str($_POST['formData'], $var);
echo "<pre>";
print_r($var);
exit;

【讨论】：

【解决方案3】：

在此处对 javascript 进行一些更改：

success: function(data)
       {
           $('#response').html(data); // show response from the php script.
       }

并在 html 代码中创建一个 id 为 response 的 div

<div id="response"></div>

【讨论】：

【解决方案4】：

改变

alert('yeah'); // show response from the php script.

到

alert(data); // show response from the php script.

【讨论】：

它在警报中显示值，但我可以在提交后回显它吗？
您应该为此使用单独的文件，比如 new2.php 仅带有 echo 语句，并使用 new2.php 更改表单操作。

【解决方案5】：

值 firstname, lastname 将不会显示，因为您通过 ajax 调用了 new1.php 并且数据（名字、姓氏和页面代码）返回到 java 脚本变量（数据）您需要将数据注入到您的文档

试试这个

$.ajax({
    type: "POST",
    url: 'new1.php',
    data: $("#myform").serialize(), // serializes the form's elements.
    success: function(data) {
        document.documentElement.innerHTML = data;
    }
});

【讨论】：