2016-04-27 3 views
0

У меня есть текстовые поля, которые используют AJAX и будут обрабатывать то, что пользователь вводит при вводе. Проблема в том, что процесс, который происходит после их ввода, является довольно загруженным. Есть ли в любом случае, что я могу заставить событие ждать 500 мсек или около того, прежде чем он обработает событие еще раз? Итак, скажем, я печатаю a, а затем через 200 мс после ввода bsdke. Событие обработает только a. Скажем, я тогда набираю asdf 600 мс после того, как набрал a. Событие затем инициирует и обрабатывает absdkeasdf, потому что после последнего процесса прошло 500 мс.Как сделать jQuery ждать после события

Или даже есть способ, которым я могу сделать событие не срабатывающим до тех пор, пока предыдущее событие, которое было вызвано, не закончило то, что он делал?

Возможно ли это? Разумеется, в конце функция тайм-аута не будет работать, верно?

$('#selection1-3-4-a, #selection1-3-4-b, #selection1-3-4-c, #selection1-3-4-d, #selection1-3-4-e, #selection1-3-4-f').on('input', function (e) { 
    var url = "/ex.php"; 
    $.ajax ({ 
    //...... 

}); 
+0

да, это называется дребезга или дросселирования (в зависимости от того, хотите ли он послать первый запрос, и один раз в п мс, или если вы хотите, чтобы не посылать любые до п мс не прошло без ввода) –

+0

Является ли вся введенная строка отображаемой на экране, когда она набрана, или отображает задержку? – nurdyguy

ответ

0

Использование SetTimeout:

var timer; 
$('#selection1-3-4-a, #selection1-3-4-b, #selection1-3-4-c, #selection1-3-4-d, #selection1-3-4-e, #selection1-3-4-f').on('input', function (e) { 
    var url = "/ex.php"; 
    clearTimeout(timer); 
    timer = setTimeout(function() { 
     $.ajax ({ 
     //...... 
    }, 500); 
}); 
0

Я бы рекомендовал использовать блокировку.

// global lock 
var locked = false; 
$('#selection1-3-4-a, #selection1-3-4-b, #selection1-3-4-c, #selection1-3-4-d, #selection1-3-4-e, #selection1-3-4-f').change(function (e) 
{ 
    if(!locked) 
    { 
     locked = true; 
     $.ajax(......) // ajax here 

     setTimeout(function(){locked = false;}, 500); 
    } 

}); 
+0

есть небольшая проблема с этим ... Если пользователь набирает весь свой запрос в течение 500 мс, единственным запросом будет первая буква. –

+0

Я думал, это то, чего он хотел. Возможно, я неправильно понял. - Я перечитал это ... он хочет тайком кэшировать var. Я отрегулирую свой ответ. – nurdyguy

+0

, который, похоже, кажется тем, что он объясняет в своем вопросе, но почему кто-то хочет, чтобы их вклад выполнялся именно так? он не собирается искать то, что пользователь на самом деле вводил. –

1

Он может получить трудно настроить событие, так что пользователи получает хороший опыт, и вы не флудить сервер с запросами при использовании функции автозаполнения.

Я бы сделал это следующим образом: Событие будет ждать X miliseconds для запуска. Если событие снова запущено, а X miliseconds не прошло, вы сбросите задержку на 0.

Давайте будем крутыми и сделаем общую функцию для этого (не могли проверить ее, она может быть повреждена) :

function delayedEvent(eventHandler, delay) { 
    var lastTimeout = null; 

    return function() { 
     var that = this, 
      args= Array.prototype.slice.call(arguments).sort(); 

     if (lastTimeout !== null) 
      window.clearTimeout(lastTimeout); 

     lastTimeout = window.setTimeout(function() { 
      eventHandler.apply(that, args); 
     }, delay); 
    }; 
} 

$('... selector ...').on('event', delayedEvent(function() { ... your code ... }, 500)); 
Смежные вопросы