jquery鍵通過搜索結果向上和向下導航

Question

我有一個輸入框，當你鍵入時顯示一個叫做「建議」的div，並將其與搜索結果進行編譯，每個結果顯示在p標籤之間。

您可以使用鼠標選擇一個結果，但我希望能夠使用向上和向下鍵選擇一個結果。

到目前爲止，如果你按下建議框再次出現（我知道它已經顯示，但多數民衆贊成在另一個問題），並嘗試將焦點添加到第一個p標籤。我怎麼能這樣做，所以你一直按下它，通過結果的過濾器可以說每次增加和刪除一類「活動」。對於上升也顯然是一樣的？

我發現有這麼多的隨機插件，但它們似乎都很複雜，而且對於我想實現的目標而言體積龐大。

$('#search input#q').keypress(function (e) { 
    switch (e.keyCode) { 
     // User pressed "up" arrow 
    case 38: 
     $('#suggestions').fadeOut('fast'); 
     break; 

    case 40: 
     // User pressed "down" arrow 
     $('#search input#q').blur(); 
     $('#suggestions').fadeIn(); 
     $('#suggestions p').focus(); 

    } 
}); 

感謝

Answer 1

自動完成是一個jQuery團隊小部件支持。它有能力選擇使用箭頭鍵並輸入。它的核心也是一個簡單的插件（可以輕鬆擴展功能）。

http://jqueryui.com/demos/autocomplete/

乾杯， awirick