jQuery的自動完成功能+搜索結果

我有下面的代碼工作，但我還是需要一些幫助搞清楚如何使自動完成輸入部分搜索欄以及。jQuery的自動完成功能+搜索結果

第一我想我需要做一個表格，並使用提交得到的結果，但是從我明白我可以簡單地使用jQuery的「搜索」的方法/事件做和保存的麻煩想了想，我未能得手

這裏是我的了：

<div id="search"> 
    <input id="project" /> 
</div>

爲HTML

$("#project").autocomplete({ 
    minLength: 0, 
    source: projects, 
    focus: function(event, ui) { 
     $("#project").val(ui.item.label); 
     return false; 
    }, 
    select: function(event, ui) { 
     $("#project").val(ui.item.label); 
     $("#project-id").val(ui.item.value); 
     $("#project-description").html(ui.item.desc); 
     return false; 
    }, 
}) 
.data("ui-autocomplete")._renderItem = function(ul, item) { 
    return $("<li>") 
    .append("<a>" + item.label + "</a>") 
    .appendTo(ul); 
};

如jQuery的我見過一些類似的問題，但我沒有得到正確的答案從我所做的自動完成列表是可見的，而鍵入單詞但我想要發生的是當用戶按下輸入鍵所有這是在自動完成列表結果將在頁面的另一部分一定格中顯示。

感謝您的幫助（試圖插入「搜索」，'域和其他一些方法沒有這些實現我的目標:(）

來源

2013-04-14 Despairy

發現了一個簡單而醜陋的解決方案將發佈時都會回答 – Despairy

這裏是代碼：

<div id="search"> 
    <input list="results" id="project" onkeydown="if (event.keyCode == 13) { checkInput(this.value); return false; }" /> 
</div>

的avaible結果...

<datalist id="results"> 
    <option>Demo</option>  
    <option>Example</option> 
    <option>pizza</option> 
</datalist>

最後的JavaScript

function checkInput(searchQuery) 
{ 
if(searchQuery=="Demo") 
{ 
    window.location = "Demo.html"; 
} 
else if(searchQuery == "Example") 
{ 
    window.location = "Example.html"; 
} 
else if(searchQuery == "Pizza") 
{ 
    window.location = "Pizza.html"; 
} 
else 
{ 
    window.location = "noresult.html"; 
} 
}

這樣的方式當過有人去搜索他們的選項預填充的列表有限，而且哪一方，他們選擇這些導致你的目標頁面！我不能拿出所有的功勞，但我希望這有助於！

來源

2014-01-20 13:43:28 user2805476

jQuery的自動完成功能+搜索結果

回答

相關問題