отправить форму с задержкой при вводе данных в поле ввода - PullRequest
10 голосов
/ 05 января 2010

У меня есть простая форма, которую мне нужно отправить автоматически при вводе текста.

Я могу использовать onChange или onKeyUp без наилучшего результата.

HTML это:

  <form action="" id="fusionSearchForm" method="post">
    <input type="text" class="std_input" id="fusion_searchText" />
  </form>

И JQuery

jQuery("#fusionSearchForm").keyup(function() {
  this.submit();
});

Отправляется каждый раз, когда вводится символ. Я бы предпочел так - перед отправкой произошла задержка, чтобы вы могли закончить набор текста - этот фокус остается на поле ввода готовым к вводу после отправки (при перезагрузке)

Есть ли способ отложить форму form.submit (), чтобы пользователь мог завершить набор до отправки формы?

(ОБНОВЛЕНИЕ, чтобы кодировать более "jQuery" способ отправки)

Br. Андерс

Ответы [ 2 ]

15 голосов
/ 05 января 2010

Это должно работать. Отправляет форму, когда ничего не было напечатано в течение 500 мс

var timerid;
jQuery("#fusionSearchForm").keyup(function() {
  var form = this;
  clearTimeout(timerid);
  timerid = setTimeout(function() { form.submit(); }, 500);
});
5 голосов
/ 05 января 2010

Это плохая идея. Вы не хотите обходить средства контроля, которые люди ожидают при вводе данных. Если вы не хотите кнопку отправки, подождите хотя бы, чтобы отправить, пока вы не захватите «ввод».

Кроме устройства чтения мыслей пользователя как вы можете узнать, когда пользователь заканчивает печатать, , если вы не искали их для ввода "return" или "enter"? Пользователи не будут знать, что они должны сделать паузу на минуту, чтобы позволить отправке формы по истечении времени ожидания, или что им нужно поторопиться, чтобы выполнить поиск до истечения времени ожидания 500 мс.

См .: этот вопрос

Если вы хотите начать возвращать результаты сразу после отправки, вы можете выполнить автозаполнение ajax.

автозаполнение http://img9.imageshack.us/img9/5526/autocompletegoogle.png

Вот пример jQuery отправки на вход:

  $("input").keypress(function(e) {
            switch (e.keyCode) {
                    case 13:
                            $("#formid").submit();
                            return false;
                    default:
                            return true;
            }
    });
...