開始使用ElasticSearch(五)之搜索框聯想提示

前幾天工做比較忙沒有過來寫，今天趁着有點空我來跟你們一塊兒研究一下搜索提示框聯想。

先來看看百度的搜索框。很是樸素簡單。做爲一個搜索引擎，推薦的搜索詞只是方便你用來進行
進一步的搜索。
邏輯上給我我的的感受是10條，那麼排序上應該是根據搜索率倒序的前10條記錄。
這裏能匹配到的數據應該不少，可是若是所有加載進來會顯得很長很長，速度還會慢。

Typeahead 的使用

爲了提升效率，我選擇了個成熟好用的搜索提示框架，由 Twitter 出品的 Typeahead.js。
源碼地址：https://github.com/twitter/typeahead.js

Typeahead 須要依賴 jQuery 1.9+，咱們先建立一個簡單的靜態頁面，名爲 index.html。
下載好 jQuery 和 Typeahead 的 JS。
先建個demo頁面index.html，內容以下。

基本上給input綁定應該都看的很清晰，找到id=demo下的class=typeahead綁定上方法下面
的hint就是提示，主要的是source：數據源。
var suggestions = ['test1', 'test2', 'test3', 'ceshi1', 'ceshi2', 'ceshi3'];
我這裏是寫死的，用post能夠去後臺請求數據源。
那麼我來看看效果。

我由於作測試沒有加樣式。須要的能夠本身加喜歡的樣式.