javascript - 使用 jQuery 和 AJAX 轮询服务器，没有初始延迟

Question

问题

大家好，我正在尝试以 10 秒的设定间隔刷新表数据...问题是，当我最初加载页面时，在显示表之前有 10 秒的延迟...

代码

标记

<h2>Employee List</h2>
<!-- table -->
<table class="table table-striped table-hover table-responsive">
    <thead>
        <tr>
            <td>ID</td>
            <td>Emplyee Name</td>
            <td>Address</td>
            <td>Created at</td>
            <td>Action</td>
        </tr>
    </thead>

    <!-- table content dynamically generated by the javascript -->
    <tbody id="showdata"></tbody>
    <!-- end content -->

</table>
<!-- end table -->

jQuery

$(function(){


        pollServer();

        function pollServer(){

            window.setTimeout(function () {
                alert('hey');
                $.ajax({ // this is a json object inside the function
                    type: 'ajax',
                    url: '<?php echo base_url('employee/showAllEmployee'); ?>',
                    async: false,
                    dataType: 'json',
                    success: function(data){
                        console.log(data);
                        var html = '';
                        var i;
                        for(i = 0; i < data.length; i++){
                            html += '<tr>' +
                                        '<td>' + data[i].employee_id + '</td>' +
                                        '<td>' + data[i].employee_name + '</td>' +
                                        '<td>' + data[i].address + '</td>' +
                                        '<td>' + data[i].created_at + '</td>' +
                                        '<td>' +
                                            '<div class="pull-right">' +
                                                '<a class="btn btn-info btn-xs item-edit" href="javascript:;" data="' + data[i].employee_id + '">Edit</a>' +
                                                '<a class="btn btn-danger btn-xs item-delete" href="javascript:;" data="' + data[i].employee_id + '"><i class="fa fa-times"></i></a>' +
                                            '</div>' +
                                        '</td>' +
                                    '</tr>'
                        }
                        $('#showdata').html(html);
                    },
                    error: function(){
                        alert('Could not get Data from Database');

                    },
                    complete: function(){
                        pollServer();
                    }
                })
            }, 10000);
        }
    });

问题

如何在页面加载时获取数据，然后每 10 秒 ping 一次服务器？

Answer 1

更改 pollServer 如下

function pollServer(){
    $.ajax({ // this is a json object inside the function
    // removed for clarity
        complete: function(){
            setTimeout(pollServer, 10000);
        }
    });
}