Question

我正在尝试获取一个PHP文件来收集目录信息，然后在我当前的html页面上显示。

我想阻止在新页面（PHP_Function.php）上打开php代码的结果，而是在完成我的PHP代码后将它们发布在我的主html页面上的div上。

我的HTML代码如下：

<form id="myFormName" method="post" action="PHP_Function.php">

        <input type="submit" class="learnButton" name="insert" value="Find Available Evidence" />

    </form>

        <script>
    $(function(){
          $("#myFormName").submit(function(event) {
            event.preventDefault();

              $.ajax({
                     type: "POST",
                     url: $(this).attr('action'),
                     data: $(this).serialize(),
                     dataType: 'json',
                     success: function(data)
                     {                 
                        //display data...
                        //("#results").html(data.name).show; 
                        //console.log(data);
                        $("#results").append(data.name); 
                        }

                   });

          });
        });
    </script>

    <div id="results"></div>

和PHP代码我有一个数组，我希望在我试过的主要html页面（ IfPresentArray ）上发布：

echo json_encode($IfPresentArray);

此外，此代码确实正确地为我提供了我想要的结果，但我希望将它们写入＆＃34; results＆＃34; div。并且没有打开带有结果的新PHP页面

我认为要做到这一点我必须使用 JSON 和 AJAX 将结果发布回页面，但我很难做到这一点并且非常感谢一些帮助。

Answer 1

首先要阻止表单发出HTTP请求。

$("#myFormName").submit(function(event) {
    event.preventDefault(); // prevent form submission

这比return false;效果更好，因为JavaScript中的任何失败都意味着永远不会达到return语句，表单将触发HTTP请求。因此，您现在可以删除return false;。

$.ajax({
    type: "POST",
    url: $(this).attr('action'),
    data: $(this).serialize(),
    dataType: 'json', // this is what you expect back from the php (i.e. json, html, etc)
    success: function(data) {                 
        // data will be your json array or object
        console.log(data); // will allow you to see return data in web browser inspection tools
        $("#results").append(data.name).show(); // show is a function (only needed if you hide the results div to start with).
    }
 });

然后检查其余JavaScript匹配的括号。使用带语法高亮的程序通常有助于此。

Answer 2

问题是我缺少括号/错误的语法。特别是在代码中：

("#results").append(data);

一开始错过 $ 。

感谢@diggersworld（和逻辑思维）

修改后的代码如下所示：

<form id="myFormName" method="post" action="PHP_Function.php">

        <input type="submit" class="learnButton" name="insert" value="Find Available Evidence" />

    </form>

    <script>
    $(function(){
          $("#myFormName").submit(function(event) {
            event.preventDefault();

              $.ajax({
                     type: "POST",
                     url: $(this).attr('action'),
                     data: $(this).serialize(),
                     dataType: 'json',
                     success: function(data)
                     {                 
                        //display data...
                        //("#results").html(data.name).show; 
                        console.log(data);
                        $("#results").append(data); 
                        }

                   });

          });
        });
    </script>

并且PHP代码保持不变：

echo json_encode($IfPresentArray);

防止PHP在新页面中显示结果

2 个答案: