如何使用jQuery UI自動完成插件進行搜索？

Question

我正在嘗試使用jQuery UI自動完成插件創建類似於Google的網站搜索。

當有人搜索自動完成時輔助搜索。這部分工作在我的網站上（圖片）：http://www.advancedifx.com/

問題是，如果你點擊下拉選擇，在我選擇的圖像示例中：搜索引擎優化，但所有點擊做的是把文本進入搜索框，然後你必須按回車。我需要獲得選擇來執行搜索的幫助。

請注意，我的Javascript技能是初學者的槓桿，並花了三天的時間纔得到這一點。如果您認爲您可以提供幫助，請準確告訴我需要修改的位置和內容。

預先感謝

$(function() { 
var availableTags = [ 
    "SEO", 
    "Responsive Design", 
    "Google Local", 
    "Twitter", 
    "Social Media", 
    "Web Design", 

]; 
$(".search_box").autocomplete({ 
    source: availableTags 
}); 

}）;

Answer 1

綜觀API：http://api.jqueryui.com/autocomplete/#event-select

您可以訪問select事件。

$(".search_box").autocomplete({ 
    source: availableTags, 
    select: function(event, ui) { 
    console.log(ui); // you can see output of this in your dev console 

    var searchTerm = ui.item; // pretty sure item will give you what you want 

    // you can then trigger your button click or form submit (whatever you're doing) 
    // passing along the searchTerm 

    $('.top_bar_search').find('form').submit(); 
    } 
});