时间戳

首页 > 解决方案 > 使用 AJAX 将变量传递到页面并在 PHP 中返回这些变量

javascript - 使用 AJAX 将变量传递到页面并在 PHP 中返回这些变量

问题描述

我正在尝试做一些我认为非常简单的事情：使用 AJAX 将表单数据传递到 PHP 页面，然后返回 PHP 的结果。

编辑添加： 正如现在所写，它只是偶尔成功返回，而不是每次运行时，出于某种原因。

编辑添加（2020 年 5 月 30 日）：

通过像这样更改 ajax，我能够使其正常工作：

<script>
                    $(document).ready(function(){

                        $("#button").click(function(){

                            var DDD_Number=$("#DDD_Number").val();
                            var Manager_Review=$("#Manager_Review").val();
                            var dataTosend='?DDD_Number='+DDD_Number+'&Manager_Review='+Manager_Review;
                            $.ajax({
                                type: "GET",
                                url:'showme.php' + dataTosend,
                                data:dataTosend,
                                async: false,
                              success:function(data){
                                    document.getElementById('txtresponse').innerHTML = "Success.";
                                    document.getElementById('thisworks').innerHTML = data;
                                },
                                error: function(data){
                                   document.getElementById('txtresponse').innerHTML = "failure.";
                               }
                            }); 
                        });
                    });
            </script>

现在我必须对表单进行序列化，因为它实际上是我必须传递的多行。不过，我不知道我是否需要将其作为第二个问题。

这是我的主页：

<html>
        <head>
            <script src="Scripts/jquery.min.js"></script>
            <script src="Scripts/jquery-2.1.3.min.js"></script>
            <script type="text/javascript" src="Scripts/jquery.plugin.min.js"></script>
            <script type="text/javascript" src="Scripts/jquery.datepick.min.js"></script>
            <script>
                    $(document).ready(function(){

                        $("#button").click(function(){
                            var DDD_Number=$("#DDD_Number").val();
                            var Manager_Review=$("Manager_Review").val();
                            var dataTosend='DDD_Number='+DDD_Number+'&Manager_Review='+Manager_Review;
                            $.ajax({
                                type: "POST",
                                url:'showme.php',
                                data:dataTosend,
                                async: true,
                               success:function(data){
                                   document.getElementById('txtresponse').innerHTML = "Success.";
                                   document.getElementById('thisworks').innerHTML = "Successful.";

                               },
                                error: function(data){
                                    console.log(data);
                                   document.getElementById('txtresponse').innerHTML = "failure.";
                                   console.log(data);
                               }
                            });
                        });
                    });
            </script>
        </head>
    <body>
        <form id="dddform" method="post">
            <input type="text" id="DDD_Number" name="DDD_Number"><br>
            <input type="text" id="Manager_Review" name="Manager_Review"><br>
            <button id="button" name="Submit">Click Me</button>
        </form>
        <div id="txtresponse"></div>
        <div id="thisworks"><?php if(!isset($_POST['Submit'])){echo $Manager_Review;} ?></div> 

            </div>
    </body>
</html>

这是showme.php：

<?php

$Manager_Review_Date = $_POST['Manager_Review'];

echo $Manager_Review_Date;

?>
<script language = 'Javascript'>
    document.getElementById('thisworks').innerHTML = '<?php echo $Manager_Review_Date; ?>';
</script>

呼叫成功。（出现“成功”和“成功”消息），但我无法让 $Manager_Review_Date 的值出现在“thisworks”DIV 中。

任何指针？我对 AJAX 相当陌生（如果您无法从我的代码中分辨出来）。

标签： javascriptphpajax

解决方案

你的 php 应该是：

<?php
$Manager_Review_Date = $_POST['Manager_Review'];
echo $Manager_Review_Date;
// NO javascript here

这个脚本的输出在回调data变量中：success

success:function(data){
    document.getElementById('txtresponse').innerHTML = "Success.";
    document.getElementById('thisworks').innerHTML = data;
},

推荐阅读