使用Ajax刷新div内容

Question

I'm using JavaScript to handle my form submission and an Ajax call to refresh a certain div only "not the entire page" , the form submission is successful but the value inside of the div doesn't refresh. 我正在使用JavaScript处理表单提交，并且使用Ajax调用来刷新某个div仅“不是整个页面” ，表单提交成功，但是div内部的值未刷新。 I've tried other methods/solutions on stack overflow but they all seem to load the entire page or the content of the div is hidden on form submission. 我已经尝试了其他方法/解决方案来解决堆栈溢出问题，但是它们似乎都加载了整个页面，或者div的内容在表单提交时被隐藏了。

ajax.js 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 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>

i am trying to refresh the variable "$likes" inside the div tag, without refreshing the whole page, right now my current code hides the variable on form submit. 我试图刷新div标签中的变量“ $ likes”，而不刷新整个页面，现在我当前的代码在表单提交中隐藏了该变量。 i have to refresh manually to view any changes to "$likes". 我必须手动刷新以查看对“ $ likes”的任何更改。

Answer 1

You are sending an XMLHTTPRequest to a whole document and not to a portion of PHP (It is the latter that you need as I understand from your question). 您正在将XMLHTTPRequest发送给整个文档，而不是发送给PHP的一部分（据我从问题中了解，这是您需要的PHP）。 Additionnaly, you are sending the request to the same current page info.php , it is better to separate the concerns by splitting your PHP code to two parts (the one the renders the intial form and the one that is intentended to process it server side). 此外，您会将请求发送到同一当前页面info.php ，最好将PHP代码分为两部分（呈现初始形式的那一部分和旨在处理服务器端的那一部分）来分离问题。）。

As a result, the AJAX will return all result of info.php (static markup + generated markup) and return all the final HTML and load it in .ld . 结果，AJAX将返回info.php所有结果（静态标记+生成的标记）并返回所有最终的HTML并将其加载到.ld 。

What I suggest is to create two files: form.php and process-form.php .Your AJAX call will be performed when document returened by form.php is ready and will be sent to process-form which will return required data after form processed. 我建议创建两个文件： form.php和process-form.php当form.php重新整理的文档ready ，您将执行AJAX调用，并将其发送到process-form ，它将在处理表单后返回所需的数据。

And this should work without refreshing the page (the main purpose of using AJAX). 并且这应该在不刷新页面的情况下起作用（使用AJAX的主要目的）。

使用Ajax刷新div内容

问题描述

1 个解决方案

解决方案1
0 已采纳 2015-07-25 16:05:51

使用Ajax刷新div内容

问题描述

1 个解决方案

解决方案1 0 已采纳 2015-07-25 16:05:51

解决方案1
0 已采纳 2015-07-25 16:05:51