如何通過Jquery UI自動填充來限制搜索匹配次數？

我目前使用JQuery UI擴展作爲搜索自動完成。但是，我需要能夠將匹配列表限制爲10.此外，我還需要在底部有一個按鈕，以顯示接下來的10個（假設的）匹配。到目前爲止，我有這個作爲我的代碼：如何通過Jquery UI自動填充來限制搜索匹配次數？

<script> 
    $(document).ready(function() { 
     var termTemplate = "<span class='ui-autocomplete-term'>%s</span>"; 

     $('input#autocomplete').autocomplete({ 
      source: ['johannesburg z', 'johannesburg x', 'johannesburg v','johannesburg b','johannesburg a','johannesburg q', 'johannesburg u', 'johannesburg y', 'johannesburg o', 'johannesburg p'], 
      minLength: 3, 
      open: function(e,ui) { 

       var 
        acData = $(this).data('autocomplete'), 
        styledTerm = termTemplate.replace('%s', acData.term); 

       acData 
        .menu 
        .element 
        .find('a') 
        .each(function() { 
         var me = $(this); 
         me.html(me.text().replace(acData.term, styledTerm)); 
        }); 

      } 
     }); 
    }); 
</script>

和HTML

<body> 
    <input id="autocomplete" /> 
    <input type="button" class="hello" /> 
</body

㈣已經檢查了類似的解決方案，但似乎沒有奏效。

來源

2011-02-11 Peter Pocket

我會處理這大部分服務器端。

例如，讓您的服務器將結果限制爲10，然後通過JSON將其輸出到客戶端。

關於滾動到下一個結果列表的按鈕，您需要實現一些模仿分頁形式的東西。自動填充下拉列表應該保留結果的偏移量。最初，極限顯然是十，而偏移量是0（結果的開始，取決於您如何在輸出上訂購它）。單擊按鈕時需要從服務器請求更多結果，並最終傳遞另一個GET變量（以及term），它們將表示結果的偏移量。你如何實現這一點取決於你，我之前沒有這樣做過，所以我不能只給你示例代碼，但jQuery UI爲你提供了足夠的框架來完成這個任務，並基於我的方法，它不應該太難。

來源

2011-07-07 14:25:40 George

喬治，我只想感謝你回答這個問題。事實證明，我實施了類似於您的解決方案。無論如何，謝謝你的時間！ – 2011-07-13 13:59:49

不是你確切的答案，但走這

$(".selector").autocomplete({ minLength: 5 });

從網站

的最少字符數用戶必須鍵入自動完成激活之前。對於只有幾個項目的本地數據，零有用。當有項目很多，其中單個字符將匹配幾千項 應增加。

http://jqueryui.com/demos/autocomplete/#option-minLength

來源

2011-02-24 12:34:09 Harish

這實際上並沒有回答這個問題... – George 2011-07-07 14:11:08

回答

相關問題