Ввод HTML при изменении значения

Question

У меня есть тег ввода. В этом теге функция автозаполнения не отключена, поэтому необязательно выпускать клавишу, чтобы изменить значение этого поля и выделить другое. Мой вопрос: как я могу обнаружить ЛЮБЫЕ изменения значения этого конкретного поля, например, e. г.

<input onvaluechange="//do following..." />

Атрибут JavaScript onchange не срабатывает при изменении значения, только при таких изменениях, как размытие, фокус и т. Д. *

РЕДАКТИРОВАТЬ: это также не обязательно нажатие клавиши. Из-за автозаполнения пользователь может просто щелкнуть мышью по результату автозаполнения, чтобы изменить значение. Это не вызовет событие onkeydown.

Answer 1

Это также не обязательно нажатие клавиши. Из-за автозаполнения

... и многие другие неключевые операции, такие как щелчок правой кнопкой мыши, вырезание / вставка, перетаскивание, отмена / повтор, настройки проверки орфографии и т. Д.

HTML5 определяет событие oninput для захвата всех прямых изменений.

К сожалению, поддержки браузера сегодня нет (в IE нет поддержки, а в других есть ошибки), поэтому все, что вы можете сделать, если вам действительно нужно обнаружить все изменения входного значения раньше, чем onchange, это используйте setInterval, чтобы добавить опрашивающее устройство, которое постоянно сравнивается с предыдущим значением.

Answer 2

Определение "значения" текстового поля ввода после события нажатия клавиши в текстовом поле?

Answer 3

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

Итак, я закончил тем, что написал простой простой плагин для мониторинга jQuery, который по своей природе универсален. С его помощью вы можете отслеживать изменения входного значения, изменения текста texta, изменения содержимого div и т. Д .:

https://github.com/nixd3v/monitor

Отслеживание изменений содержимого div:

$.monitor('add', function(){return $("div#someDiv").html()}, function(){
    console.log('Div content changed');
});

Отслеживание изменений входного значения:

$.monitor('add', function(){return $("#password").val()}, function(){
    console.log('input value changed');
});

Конечно, он также использует цикл, но не через setInterval , а скорее через использование setTimeout вместе с самовыполняющейся анонимной функцией:

(function(){
    // do some stuff
    setTimeout(arguments.callee, 100);
})();

Что это делает - это гарантирует, что следующий вызов не будет выполнен до того, как ваш код был выполнен. Если вы используете опрос в своем коде - это правильный способ сделать это.

Answer 4

Вы можете использовать атрибут onKeyPress для отслеживания изменений, введенных пользователем.

Например:

<input type='input' onKeyPress='SomeScriptMethod();'>