如何在 javascript 和 jquery 中隐藏数据表显示条目？

Question

我正在使用 jQuery 的 DataTable 插件，并使用 show entries(datatables_length) 有一个下拉列表来选择一次在页面上显示多少条目。我还有一个由 DataTable 提供的内置小型搜索功能来搜索所需的条目。我正在努力隐藏页面上的显示条目下拉列表，仅当 DataTable 搜索未在搜索栏中找到任何匹配数据时。下面是我的代码。如果搜索功能返回空值或没有匹配值，请帮我隐藏显示条目下拉列表。

$(document).ready(function() {
       
    $('#table').DataTable() {
        'oLanguage': {
            'sSearch': '<span>Search</span>'
        },
            lengthMenu : [ 5, 10, 15, 20],
            pagingType: 'full_numbers'
        });
        searchForData();
    });

    function searchForData() {
        $('.datatable_filter input[type="search"])
          .attr('placeholder', 'person Id', 'Person name')
          .css({'width':'500px', 'display':'inline-block'});
    }
});

Answer 1

这里可以使用drawCallbackoption

$(document).ready( function () {
  var table = $('#table').DataTable({
    drawCallback: function(){
      var api = this.api();
      var records = api.page.info().recordsDisplay;
      var pageMenu = $('div.dataTables_length');
      if (records === 0) {
        pageMenu.hide();
      } else if (pageMenu.css('display') == 'none') {
        pageMenu.show();
      }
      // HERE IS YOUR FUNCTION TO CUSTOM YOUR SEARCH INPUT
      searchForData();   
    }
  });
});

一个活生生的例子：http://live.datatables.net/pecafifi/2/edit

如果您使用 DataTables 版本 ，则必须使用 fnDrawCallback option