JQuery DataTables - 在搜索之前隐藏表

Question

我正在使用DataTables和JQuery在我的网站上显示一些数据。我使用搜索功能过滤数据，并给出预期的结果。我想要做的是隐藏表，直到用户开始在框中键入搜索，然后才显示正确的结果。这是我的DataTables代码：

    function renderTable() {
        jQuery('.dataTable').show();
        jQuery('.dataTables_info').show();
        jQuery('.dataTables_paginate').show();
    }

    function hideTable() {
        jQuery('.dataTable').hide();
        jQuery('.dataTables_info').hide();
        jQuery('.dataTables_paginate').hide();
    }

    jQuery('.dataTables_filter input').keypress(function() {
        if (jQuery('.dataTables_filter input').val() != '') {
            renderTable();
        } else {
            hideTable();
        }
    });

    jQuery(document).ready(function() {

        jQuery('#resultsTable').DataTable({
            "paging": true,
            "pageLength": 25,
            "lengthChange": false,
            "pagingStyle": "simple_numbers",
            "language": {
                "search": "",
                "searchPlaceholder": "Search for an entry"
            },
            "order": [1, 'asc']
        });

        hideTable();

    } );

它成功地隐藏了DataTable中的所有内容，但却隐藏了document.ready上的搜索框，但是当用户点击框中并输入类型时，我无法调用我的renderTables（）函数。我不确定我是否正确使用：'。dataTables_filter input'。 DataTables呈现的搜索输入没有我可以定位的任何唯一ID，因此我必须从包含它的filter元素中引用它。

Answer 1

尝试这样的事情：

创建一个函数来使用所需的filter参数呈现数据表，并在搜索功能上调用它。这样它就无法在页面加载时呈现表格。启动搜索功能后，它将使用filter参数呈现表。

例如：

$(document).ready(function(){
    $('#search_box').keyup(function(){
        var searchStr = $(this).val();

        if((searchStr).length)
        {
            filterData();   // call the filter function with required parameters
        }
        else
        {
            // empty the table body
        }
    });
});

function filterData()
{
    // your code
}