Question

我使用JavaScript处理表单提交和Ajax调用只刷新某个div ＆＃34;而不是整个页面＆＃34; ，表单提交成功但是div内部的值不会刷新。我已经尝试过堆栈溢出的其他方法/解决方案，但它们似乎都加载了整个页面，或者div的内容隐藏在表单提交上。

ajax.js

  $(document).ready(function () {
      $('.ajaxform').submit(function (e) {
          e.preventDefault(); // catch the form's submit event
          $.ajax({ // create an AJAX call...
              data: $(this).serialize(), // get the form data
              type: "POST", // POST
              dataType: 'html',
              url: "info.php", // the file to call
              cache: false,
              success: function (response) { // on success..
                  $(".ld").load("info.php .ld"); //this hides the content of the div
                  // $('.ld').html(response);----This loads the entire page inside the div
              }
          });
          return false; // cancel original event to prevent form submitting
      });
  });

info.php的的

<html>
    <head>
    </head>
    <body>
    <?php
        ...................
        foreach($stmt as $obj){
            $id = $obj['id'];
            $likes = $obj['like1'];

            echo '<form action="" method="post" id="ajaxform" enctype="multipart/form-data">';
            echo '<input type="hidden" name="lkcv[]" value="'.$id.'">';
            echo '<input type="hidden" name="like" value="">';
            echo '<input type="image" src="images/like.png" id="lksub" width="15" 
                 value="som" height="15" style="float:right;position:relative;
                 margin-right:290px;"/><div class="ld">'.$likes.'</div>';
            echo '</form>’;
            echo '<div id="emailform"></div>';
        }
    ?>
    </body>
</html>

我正在尝试刷新变量＆＃34; $ likes＆＃34;在div标签内，没有刷新整个页面，现在我的当前代码隐藏了表单提交上的变量。我必须手动刷新以查看＆＃34; $ likes＆＃34;的任何更改。

Answer 1

您正在向整个文档发送XMLHTTPRequest而不是PHP的一部分（正如我从您的问题中理解的那样，您需要的是后者）。另外，您要将请求发送到同一当前页面info.php，最好通过将PHP代码拆分为两部分来分离问题（渲染初始形式的部分和用于处理它的部分）服务器端）。

因此，AJAX将返回info.php（静态标记+生成的标记）的所有结果，并返回所有最终HTML并将其加载到.ld中。

我建议创建两个文件：form.php和process-form.php。当form.php撤回的文档为ready时，您的AJAX调用将被执行并将被发送到process-form将在表单处理后返回所需的数据。

这应该无需刷新页面（使用AJAX的主要目的）。

使用ajax刷新div内容

1 个答案: