1. 程式人生 > >JQuery DataTables 隱藏搜尋框 及 延遲搜尋

JQuery DataTables 隱藏搜尋框 及 延遲搜尋

這一小節,說一個小知識點。隱藏搜尋框延遲搜尋的簡單介紹。

隱藏搜尋框

上一篇 部落格介紹了 JQuery DataTables 自定義查詢, 我們知道 在 使用 API 中的 Search方法時,需要將 searchiing 配置設定為 true。

但是設定 為true,之後,過濾框會自動顯示出來(如下圖)。 但是搜尋框 監聽的是我們鍵盤輸入,有輸入時就會發起請求,這對於我們服務端查詢來說,是一種資源的消耗(當然我們可以通過延遲查詢,下面我們將介紹)

搜尋框

所以我們可能有 隱藏搜尋框的需求,我們應該如何實現呢?

答:我們可以通過 配置dom來隱藏搜尋框

    dom:'lBrtip'

延遲查詢

Datatables的客戶端搜尋和伺服器搜尋預設的延遲時間是400ms,所以當按下鍵後就立馬開始搜尋, 這樣處理只是符合大多數情況,但是有些時候這樣處理太消耗資源,降低了使用者體驗,我們可以通過以下配置來優化效能。

 var table = $('#example').DataTable( {
   searchDelay: 350
 } );

searchDelayOption searchDelay不定時一講 預設值為 null , 他會自己判斷如果是客戶端模式,值為 Instant (及時),如果是伺服器模式,值為 400ms