每5秒用jQuery / Ajax刷新一个表

如何解决每5秒用jQuery / Ajax刷新一个表

|| 因此，我有一张表从数据库中提取信息，我想知道如何在不重新加载整个页面的情况下使其刷新其信息。

解决方法

您将需要一个“ 0”页面来显示您的表格，没有其他内容：没有页眉，页脚等。 PHP（getTable.php）-这可以是任何服务器端代码（asp，html等。）

<?php
    echo \'<table><tr><td>TEST</td></tr></table>\';
?>

然后，在您的JS中，您可以使用load()方法轻松刷新表：的HTML

<div id=\"tableHolder\"></div>

<script type=\"text/javascript\">
    $(document).ready(function(){
      refreshTable();
    });

    function refreshTable(){
        $(\'#tableHolder\').load(\'getTable.php\',function(){
           setTimeout(refreshTable,5000);
        });
    }
</script>

,使用ajax，以下示例在jQuery中：

$(function() {
    var prevAjaxReturned = true;
    var xhr = null;

    setInterval(function() {
        if( prevAjaxReturned ) {
            prevAjaxReturned = false;
        } else if( xhr ) {
            xhr.abort( );
        }

        xhr = $.ajax({
            type: \"GET\",data: \"v1=\"+v1+\"&v2=\"+v2,url: \"location/of/server/script.php\",success: function(html) {
                 // html is a string of all output of the server script.
                $(\"#element\").html(html);
                prevAjaxReturned = true;
           }

        });

    },5000);
});

成功函数假设您的服务器脚本在ID为\'element \'的元素中输出要替换的html。 ,您应该有一个页面，该页面返回信息并使用Ajax / jQuery提取数据。

<div class=\"result\"></div>

setInterval(function() {

    $.get(\'table.php\',function(data) {
      $(\'#result\').html(data);
    });

},5000);

,这是供您使用的另一个选项。此解决方案使用的是IIFE，它比setInterval优先。您可以在上面的链接中了解有关IIFE的更多信息。 JAVASCRIPT：

var $results = $(\'#results\'),loadInterval = 5000;
(function loader() {
    $.get(\'script.php\',function(html){
            $results.hide(200,function() {
                $results.empty();
                $results.html(html);
                $results.show(200,function() {
                    setTimeout(loader,loadInterval);
                });
            });
    });
})();

HTML：

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

setTimeout(function(){

      jqueryFunction(Args);

},100);

将工作... 100 = 100毫秒 ,以下适用于JQuery Datatables 1.10

`var tableName;
//Set AJAX Refresh interval.
$(function() {
    setReloadInterval(10);  //Refresh every 10 seconds. 
}

//Because function takes seconds we * 1000 to convert seconds to milliseconds.
function setReloadInterval(reloadTime) {
    if(reloadTime > 0)
        internalId = setInterval(\"reloadTable()\",(reloadTime * 1000);
}

//Auto Refresh JQuery DataTable 
function reloadTable() {
    tableName.ajax.reload();
}

//Table defined...
$(document).ready(function () {
    tableName = $(\'#tableName\').DataTable({
        \"sAjaxSource\": \"/someUrl\",});`