12 ответов:
можно использовать
.change()$('input[name=myInput]').change(function() { ... });однако это событие будет срабатывать только тогда, когда селектор потерял фокус, поэтому вам нужно будет щелкнуть в другом месте, чтобы выполнить эту работу.
Если это не совсем правильно для вас, вы могли бы использовать некоторые другие jQuery-события как keyup,keydown или нажатие - в зависимости от точного эффекта, который вы хотите.
как сказал @pimvdb в своем комментарии,
обратите внимание, что изменение будет срабатывать только тогда, когда входной элемент потерял фокус. Существует также событие ввода, которое срабатывает всякий раз, когда текстовое поле обновляется без необходимости терять фокус. В отличие от ключевых событий он также работает для вставка / перетаскивание текста.
(см. документация.)
Это настолько полезно, что стоит поставить его в ответ. В настоящее время (v1.8*?) нет .вход() удобство fn в jquery, поэтому способ сделать это
$('input.myTextInput').on('input',function(e){ alert('Changed!') });
Я бы предложил использовать событие keyup что-то вроде ниже:
$('elementName').keyup(function() { alert("Key up detected"); });обновление: это работает только для ручного ввода не копировать и вставлять.
для копирования и вставки я бы порекомендовал следующее:
$('elementName').on('input',function(e){ // Code here });
вот код, который я использую:
$("#tbSearch").on('change keyup paste', function () { ApplyFilter(); }); function ApplyFilter() { var searchString = $("#tbSearch").val(); // ... etc... } <input type="text" id="tbSearch" name="tbSearch" />это работает довольно хорошо, особенно в паре с
jqGridуправление. Вы можете просто ввести в текстовое поле и тут просмотр результатов в вашемjqGrid.
здесь один и только один надежный способ сделать это, и это путем вытягивания значения в интервале и сравнения его с кэшированным значением.
причина, по которой это единственный способ, заключается в том, что существует несколько способов изменить поле ввода с помощью различных входов (клавиатура, мышь, вставка, история браузера, voiceinput и т. д.) и вы никогда не сможете обнаружить их все, используя стандартные события в кросс-браузерной среде.
к счастью, благодаря этому событию инфраструктура в jQuery, это достаточно легко добавить свои собственные события inputchange. Я сделал это здесь:
$.event.special.inputchange = { setup: function() { var self = this, val; $.data(this, 'timer', window.setInterval(function() { val = self.value; if ( $.data( self, 'cache') != val ) { $.data( self, 'cache', val ); $( self ).trigger( 'inputchange' ); } }, 20)); }, teardown: function() { window.clearInterval( $.data(this, 'timer') ); }, add: function() { $.data(this, 'cache', this.value); } };использовать его как:
$('input').on('inputchange', function() { console.log(this.value) });здесь есть демо:http://jsfiddle.net/LGAWY/
если вы боитесь нескольких интервалов, вы можете связать / отменить это событие на
focus/blur.
<input id="item123" class="firstName" type="text" value="Hello there" data-someattr="CoolExample" /> $(".firstName").on('change keyup paste', function () { var element = $(this); console.log(element); var dataAttribute = $(element).attr("data-someattr"); console.log("someattr: " + dataAttribute ); });Я рекомендую использовать
thisключевое слово для того, чтобы получить доступ ко всему элементу, так что вы можете сделать все, что вам нужно с этим элементом.
следующее будет работать, даже если это динамические/Ajax вызовы.
сценарий:
jQuery('body').on('keyup','input.addressCls',function(){ console.log('working'); });Html,
<input class="addressCls" type="text" name="address" value="" required/>Я надеюсь, что этот рабочий код поможет кому-то, кто пытается получить доступ к динамическим вызовам/Ajax...
это сработало для меня. Если поле с именем fieldA нажимается или любой ключ, введенный в него, обновляет поле с идентификатором перемещение.
jQuery("input[name='fieldA']").on("input", function() { jQuery('#fieldB').val(jQuery(this).val()); });
вы можете просто работать с идентификатором
$("#your_id").on("change",function() { alert(this.value); });
вы могли бы использовать
.keypress().например, рассмотрим HTML:
<form> <fieldset> <input id="target" type="text" value="Hello there" /> </fieldset> </form> <div id="other"> Trigger the handler </div>обработчик события может быть привязан к полю ввода:
$("#target").keypress(function() { alert("Handler for .keypress() called."); });я полностью согласен с Энди, все зависит от того, как вы хотите его работать.
Comments