Question

我在我正在制作的小型jquery应用中使用dataTables。我基本上有一个搜索栏，我只想点击搜索图标。为了使搜索栏消失“bFilter”：true，应该设置为false。这是我创建的fiddle以及到目前为止我所拥有的。

以下是我尝试但不起作用。

<script>
    (document).ready( function () {
      $('#example').dataTable( {
        "bPaginate": false,
        "bFilter": false,
       "oLanguage": { "sSearch": "" } 



      } );

      $('.dataTables_filter input').attr("placeholder", "enter seach terms here");
    } );

    $('#search').click(function(e) {  

      $('#example').dataTable( {

        "bFilter": true




      } );

        });
</script>

在此我基本上将bfilter设置为false以使其不显示并尝试在单击搜索图标时将其设置为true。有人可以帮忙吗？也出于某种原因，我的搜索图标css搞砸了idk为什么。请指教。

Answer 1

这将隐藏您的过滤器输入框，并在您单击搜索图标时显示它。

CSS：

#example_filter {
    display: none;
}

JS：

$('#search').click(function(e) {  
    $('#example_filter').show();
});

DEMO：JSFIDDLE

或者，您可以使用.toggle（），这样第二次点击会再次隐藏该框。

$('#search').click(function(e) {  
    $('#example_filter').toggle();
});

单击时会显示DataTables搜索栏

1 个答案: