jquery: наблюдать за полем с частотой

Мне нужно использовать JQuery, чтобы обнаружить изменения в текстовом файле, поэтому вызывается некоторый ajax.

Хитрость в том, что я действительно не хочу привязывать это действие к событиям размытия или нажатия клавиш; Первый слишком громоздкий для пользователя, а второй — «слишком непосредственный»: пользователь вводит новые ключи до того, как вызов ajax будет завершен, поэтому пользовательский опыт невелик (поэтому ответ на этот ТАК вопрос не относится к моему делу).

Мне нужен код, который проверяет, изменилось ли значение поля, но периодически (то есть каждые 0,5 секунды). Я хотел бы использовать один и тот же код в нескольких полях, вызывая разные функции ajax с разной частотой, поэтому повторное использование здесь действительно плюс.

На Rails у меня было observe_field (внутренне использует Prototype Form.Element.observer , я думаю), что сделал именно это. Как я могу сделать то же самое в JQuery?


person kikito    schedule 23.02.2010    source источник


Ответы (3)


Я закончил тем, что запустил свой собственный плагин jquery.

Это (в общих чертах) основано на реализации Mic.

Создал для него проект на гитхабе:

http://github.com/splendeo/jquery.observe_field

Основные отличия от микрофона:

  • Я использую методы jQuery вместо нативных в паре мест.
  • Я не активирую/деактивирую обнаружение размытия и фокусировки. Таким образом, я могу отслеживать изменения, сделанные с помощью кода (это делает наблюдать_поле рельсов, и я хотел имитировать это)
  • Я сбрасываю таймер при каждом включении. Мне это было нужно, чтобы хорошо играть с мобильными устройствами, такими как iphone.

Быстрый фрагмент:

$(function() {
  // Executes a callback detecting changes with a frequency of 1 second
  $("#item1").observe_field(1, function( ) {
    alert('Change observed! new value: ' + this.value );
  });
});
person kikito    schedule 24.02.2010
comment
Я восхищаюсь тем, что вы выпустили свой собственный плагин, но не имеет ли смысл проверять, когда пользователь перестал печатать, а не через постоянные промежутки времени? Другие плагины, которые я видел, делают это на основе этого: github.com/rpheath/searchbox - person Brian Armstrong; 01.05.2010
comment
Эм... Вот что я имел в виду, говоря, что таймер сбрасывается при каждом нажатии клавиши. - person kikito; 01.05.2010

Вот решение, использующее простую функцию JS: Как получить значение из поля ввода html-формы при его вводе?< br/> Вы можете использовать вызов $(...).focus(...), чтобы использовать его с jquery, если хотите.

При наведении фокуса на поле происходит периодическая проверка, не изменилось ли значение, если да, то вызывается callback-функция «после».
При выходе из поля, при включении блура опрос останавливается.

Это будет работать, даже если пользователь сделает некоторые косвенные изменения, такие как отмена/повтор или копирование/вставка в поле.

person Mic    schedule 23.02.2010
comment
Спасибо, Мик, я буду использовать вашу реализацию в качестве шаблона. - person kikito; 23.02.2010

Вы можете установить таймер для проверки ввода каждые n секунд, есть плагин для jQuery, который даст больше контроля над таймерами.

http://jquery.offput.ca/every/

person Boris Guéry    schedule 23.02.2010