php - 我想在 $.post 中实时更新，无需重新加载或刷新

Question

这是我的 PHP 代码_

if(isset($_REQUEST['show']))
{
        $con=mysqli_connect("localhost","root","","server_name");

        $show = mysqli_query($con, "SELECT * FROM name1 ORDER BY date DESC");
        $html='';
        while($showE = mysqli_fetch_array($show)) 
        {
        $html.= '<h3>'.$showE['un_name'].'</h3>';
        $html.= '<div>'.$showE['un_name_dec'].'</div>';
        }
        echo $html;
       //End of while loop

}

这是jQuery代码_

$.post('preprocessor.php', '&show=', function(data) {
    $("#accordion").html(data);
    $("#accordion").accordion({
       collapsible: true,
       icons: {
            activeHeader: "ui-icon-triangle-1-s",
            header: "ui-icon-triangle-1-e"
        }
    });
    });

这是身体_

<div id='accordion'>
</div>  

我没有得到实时更新，一切正常，但是 Ajax 的东西不起作用......如果我刷新或重新加载页面但它本身不起作用

Answer 1

您正在寻找的是setTimeout.

 $("#accordion").accordion({
       collapsible: true,
       icons: {
            activeHeader: "ui-icon-triangle-1-s",
            header: "ui-icon-triangle-1-e"
        }
    });
setInterval(makePostCall, 15000); // decide interval to fetch new updates. 15 sec for example

function makePostCall(){
$.post('preprocessor.php', '&show=', function(data) {
    $("#accordion").html(data);

    });
}

但这不是做这种事情的正确方法。考虑使用Ajax 推送引擎

Answer 2

您是否设置间隔以特定间隔调用代码？您需要做的就是，在 JavaScript 上添加：

 setinterval(function(){/* do the post here */ },1000 /*this is time */);

Answer 3

如果我刷新或重新加载页面而不是它本身，它会起作用

为此，您需要使用setInterval();将检查给定的每个特定时间段的功能：

   setInterval(function(){
      $.post('preprocessor.php', '&show=', function(data) {
         $("#accordion").html(data);
         $("#accordion").accordion({
                   collapsible: true,
                   icons: {
                   activeHeader: "ui-icon-triangle-1-s",
                   header: "ui-icon-triangle-1-e"
                   }
         });
      });
   },5000); //<---- runs every 5000 ms 

这将每 5 秒运行一次并更新#accordiondiv。

Answer 4

尝试：

$.post('preprocessor.php', {show:''}, function(data) {
$("#accordion").html(data);
$("#accordion").accordion({
   collapsible: true,
   icons: {
        activeHeader: "ui-icon-triangle-1-s",
        header: "ui-icon-triangle-1-e"
    }
});
},'html');