Question

我需要HTML页面中的一个部分，只要用户执行成功的数据输入，该部分就会更新。数据输入来自用户输入MySQL数据库，然后我将查询表过滤器状态为Success，并按创建日期DESC排序。

我不想刷新整个页面，只是部分/ div（我不知道使用哪种做法）。实现这一目标的最佳方法是什么？阿贾克斯？ IFRAME？

Answer 1

你可以尝试这样的事情。

<!DOCUMENT>
<html lang="en">
 <head>     
  <title>Auto Load and Refresh Div Every 10 seconds</title>     
  <style>
    #auto_load_div>div{width:100%;max-width:320px;}
  </style>     
 </head>
 <body>     
     <div id="auto_load_div"></div>
     <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
     <script>
      function auto_load(){
        $.ajax({
          url: "data.php",
          cache: false,
          success: function(data){
             $("#auto_load_div").html(data);
          } 
        });
      }     
      $(document).ready(function(){     
        auto_load(); //Call auto_load() function when DOM is Ready     
      });     
      //Refresh auto_load() function after 10000 milliseconds
      setInterval(auto_load,10000);
   </script>
 </body>
</html>

也是这样。

HTML

<div id="divID"> <!-- THE DATA FROM THE FORM VIA PHP --> </div>
<form id='foo' onsubmit="return false">
 <input type='text' name="yourname">
 <input type='submit'>
</form>

在你给出id的html中显示响应。

JQUERY

$('#foo').submit(function(event){
  $.ajax({
    url: 'index.php',
    type: 'post',
    dataType:'html',   //expect return data as html from server
   data: $('#foo').serialize(),
   success: function(response, textStatus, jqXHR){
      $('#divID').html(response);   //select the id and put the response in the html
    },
   error: function(jqXHR, textStatus, errorThrown){
      console.log('error(s):'+textStatus, errorThrown);
   }
 });
});

在这里写你的HTML ...我只是在这里打印post变量...你可以根据需要使用<table>（html）

的index.php

echo $_POST['yourname'].

Answer 2

Ajax最适合您的申请。但是，根据您所说的内容，我认为您需要处理web-sockets，因为您必须不断收听数据库更改。如果你还没有完成它，试着找出如何在php中实现它。

如何刷新HTML页面的一部分

2 个答案: