Событие Keyup через интервал времени

Question

У меня есть этот код jQuery, который запрашивает API по событию keyup (через keyterms.php). Это работает, как есть, но я пытаюсь выяснить, как реализовать так называемую «паузу», чтобы она выполняла запрос только через определенный промежуток времени (скажем, 2 секунды) после последнего нажатия клавиш. Любая помощь будет высоко ценится. Спасибо!

$(document).ready(function() {
    $('#loading').hide();
    $('#q').keyup(function(){
      $('#loading').show();
      $.post("keyterms.php", {
        q: $('#q').val()
      }, function(response){
        $('#qResult').fadeOut();
        setTimeout("finishAjax('qResult', '"+escape(response)+"')", 400);
      });
        return false;
    });
});

Answer 1

Вы можете использовать плагин jQuery, который StackOverflow использует для Users Page ; это называется TypeWatch

Может применяться так:

<input type="text" id="tb" />


<script>
$("#tb").typeWatch({ highlight: true, wait: 500, captureLength: -1, callback: finished });
</script>

Где в этом случае finished - это функция обратного вызова (ссылка), которая будет вызываться, когда количество введенного времени (в данном случае 500 мс) пройдет от последнего события keyUp.

Вот краткое описание параметров, которые он принимает ( фактически он принимает один параметр, объект, и его свойства используются в качестве входных параметров ):

• выделение : эстетика, определяет, следует ли выделять текст, когда текстовое поле получает фокус. По умолчанию true
• wait : Количество миллисекунд ожидания, пока плагин считает, что набор текста завершен. По умолчанию 750 .
• captureLength : минимальное количество символов, необходимое для запуска события. По умолчанию 2 .
• обратный вызов: Функция обратного вызова после того, как пользователь «закончил» печатать. По умолчанию void

Для демо этого плагина, посетите Users Page

Answer 2

Используйте setTimeout, чтобы вызывать метод ajax только через две секунды после нажатия клавиши, а не вызывать его напрямую при нажатии клавиши. Я не слишком знаком с недостатками JQuery, поскольку у меня еще не было возможности поиграть с ним, но он должен быть в состоянии использовать ваш метод выше.

(Примечание: две секунды - это довольно долго;))