Question

我正在使用数据表（https://datatables.net/）并且我启用了延迟加载。它只需要做什么，加载10个结果（或者某些东西，现在它并不重要）。然后，当你点击一个新页面时，它必须得到X下一个结果（可能有很多结果，所以我不想一次加载所有数据）。

现在，有一个问题。如果我搜索，在每个字符之后它发送一个AJAX请求，导致大量的AJAX请求。但它应该做的是：

加载10个项目
您输入
在最后输入的字符后，等待2秒，然后触发AJAX请求

我收到了这段代码：

var dataTable = $('#editor').dataTable({
    ajax: {
        url: baseUrl + '/ajax/getWebpages',
        dataSrc: '',
        type: 'POST'
    },
    deferLoading: 10,
    serverSide: true,
    searchDelay: 2000,
}).on('search.dt', function()
{
    clearTimeout(timer);

    timer = setTimeout(function() {
        return true;
    }, 2000);
});

我知道返回true可能是错误的，我真的不知道如何让我的想法发挥作用。我搜索了很长时间但找不到任何东西。

Answer 1

找到答案：

我必须将我的代码放在initComplete中，例如：

var dataTable = $('#editor').dataTable({
    ajax: {
        url: baseUrl + '/ajax/getWebpages',
        dataSrc: '',
        type: 'POST'
    },
    deferLoading: 57,
    serverSide: true,
    searchDelay: 2000,
    columns: [ ],
    initComplete: function()
    {
        var api = dataTable.api();

        $('.dataTables_filter input').unbind('.DT').bind('keyup.DT', function(e)
        {
            var value = this.value;

            clearTimeout(timer);

            timer = setTimeout(function() {
                api.search(value).draw();
            }, 400);
        });
    }
});

阐释：

您键入内容，此功能会清除timer中存储的超时（在我的情况下为＆＃39;全局＆＃39;变量）
如果您停止输入，则不会清除超时（因为它只会在您键入时清除）
最后一次400毫秒的超时仍处于活动状态，因此在输入最后一个字符后400毫秒后，它将执行。

initComplete是在初始化dataTables之后调用的事件。 .unbind('.DT')删除了keyup事件，因此无法自动调用AJAX请求。 api.search进行搜索。

数据表延迟加载服务器端过滤器延迟

1 个答案: