ajax 调用不更新

Question

我打了一个 Ajax 电话。它显示我网站上的数据，但如果我在数据库中更改它，它不会自动更新（不按 f5（刷新我的网站））。

这是我的代码：

$(document).ready(function(){
    getname();
})
function getname(){
        $.ajax({
            type: 'post',
            url: '../php/clas/name.php',
            data: 'type=getthename',
            dataType: 'json',
            success: function(responseOrderData){
                var showOrderData = '';
                var rows = 0;
                $.each(responseOrderData, function(index){
                    rows++;
                    showOrderData += '<tr>';
                    showOrderData += '<td>';
                    showOrderData += responseOrderData[index].name;
                    showOrderData += '</td>';
                    showOrderData += '</tr>';
                    console.log(responseOrderData);
                });
                if(rows == 0){
                    showOrderData += '<tr><td colspan="7"><center><i class="fa fa-refresh fa-spin"></i></center></td></tr>';    
                }
                $('.orderData').html(showOrderData);
            },
            timeout: 1000,
            error: function(error){
                console.log(error);
            }
        })
    }

Answer 1

您需要 socket.io 之类的东西来进行实时更新并将数据从服务器发送到客户端，但您可以使用 JavaScript setTimeout 或 setInterval 来完成任务刷新 html 内容而不重新加载页面

$(document).ready(function(){
    getname();
})
function getname(){
        $.ajax({
            type: 'post',
            url: '../php/clas/name.php',
            data: 'type=getthename',
            dataType: 'json',
            success: function(responseOrderData){
                var showOrderData = '';
                var rows = 0;
                    if(rows == 0){
                    showOrderData += '<tr><td colspan="7"><center><i class="fa fa-refresh fa-spin"></i></center></td></tr>';    
                }
                $.each(responseOrderData, function(index){
                    rows++;
                    showOrderData += '<tr>';
                    showOrderData += '<td>';
                    showOrderData += responseOrderData[index].name;
                    showOrderData += '</td>';
                    showOrderData += '</tr>';
                    console.log(responseOrderData);
                });

                $('.orderData').html(showOrderData);
                //wait 10 seconds after ajax called successfully
                setTimeout(getname,10000);
            },
            timeout: 1000,
            error: function(error){
                console.log(error);
            }
        })
    }

ajax 调用不更新

ajax call does not update

ajax

call