Разрешение навигации по клавише со стрелкой / ввод функциональности в поле автозаполнения

Question

Я учусь, как реализовать поле автозаполнения, и я просто не могу понять, как сделать результаты доступными с помощью клавиш со стрелками и кнопки ввода. Я действительно понятия не имею, как бы я поступил так. У меня уже есть, поэтому, когда я нажимаю на поле, результаты перемещаются в поле ввода, но теперь я хочу сделать результаты доступными с помощью клавиш со стрелками, а когда вы нажмете ввод, он переместит этот элемент в поле ввода. Вот мой код:

    <div class="input-wrapper">
<input type="text" class="autosuggest" value="Type in a city or town" onblur="onBlur(this)" onfocus="onFocus(this)" > <input type="submit" value="Search">

<div class="dropdown">
    <ul class="result"></ul>


</div>
</div>

И скрипт:

    $(document).ready(function() {
$('.autosuggest').keyup(function() {
var search_term = $(this).attr('value');

$.post('php/search.php', { search_term: search_term }, function(data) {
    $('.result').html(data);

$('.result li').click(function(){
    var result_value = $(this).text();
    $('.autosuggest').attr('value', result_value);
    $('.result').html('');

    });

    });

});
     });
     function onBlur(el) { 
    if (el.value == '') { 
      el.value = el.defaultValue; 
    } 
    } 
   function onFocus(el) { 
      if (el.value == el.defaultValue) { 
       el.value = ''; 
    } 
   } 

Answer 1

$('.autosuggest').keyup(function(e) {
    if(e.which == 13) {
        // yourcode
    }
});