событие изменения текстового поля jQuery не срабатывает, пока текстовое поле не потеряет фокус?

Question

событие изменения текстового поля jQuery не срабатывает, пока текстовое поле не потеряет фокус?

я обнаружил, что событие изменения jQuery в текстовом поле не срабатывает, пока я не нажму вне текстового поля.

HTML:

<input type="text" id="textbox" />

JS:

$("#textbox").change(function() {alert("Change detected!");});

посмотреть демо на JSFiddle

мое приложение требует, чтобы событие запускалось при каждом изменении символа в текстовом поле. Я даже попытался использовать keyup вместо этого...

$("#textbox").keyup(function() {alert("Keyup detected!");});

...но это известный факт, что событие keyup не запускается при щелчке правой кнопкой мыши и вставке.

любой обходной путь? Наличие обоих слушателей вызовет какие-либо проблемы?

661 7

jQuery events textbox

7 ответов:

Comments

Ничего не найдено.

Petah · Accepted Answer · 2013-06-26 13:47:37

привязка к обоим событиям является типичным способом сделать это. Вы также можете привязать к событию вставки.

вы можете привязать к нескольким событиям, как это:
$("#textbox").on('change keyup paste', function() {
    console.log('I am pretty sure the text box changed');
});
если вы хотите быть педантичным об этом, вы также должны привязать к mouseup для удовлетворения перетаскивания текста вокруг, и добавить lastValue переменная, чтобы убедиться, что текст действительно изменился:
var lastValue = '';
$("#textbox").on('change keyup paste mouseup', function() {
    if ($(this).val() != lastValue) {
        lastValue = $(this).val();
        console.log('The text box really changed this time');
    }
});
и если вы хотите быть super duper педантичный, то вы должны использовать таймер интервала для удовлетворения автоматического заполнения, плагинов и т. д.:
var lastValue = '';
setInterval(function() {
    if ($("#textbox").val() != lastValue) {
        lastValue = $("#textbox").val();
        console.log('I am definitely sure the text box realy realy changed this time');
    }
}, 500);

A. Wolff · Accepted Answer · 2015-02-02 18:08:44

на современных браузерах, вы можете использовать the input событие:

демо
$("#textbox").on('input',function() {alert("Change detected!");});

Milan · Accepted Answer · 2016-06-15 13:26:35

if you write anything in your textbox, the event gets fired.
code as follows :

HTML:

<input type="text" id="textbox" />

JS:

<script type="text/javascript">
  $(function () {
      $("#textbox").bind('input', function() {
      alert("letter entered");
      });
   });
</script>

Tony Dong · Accepted Answer · 2014-06-20 20:00:35

$(this).bind('input propertychange', function() {
        //your code here
    });
это работает для ввода, вставить, Правой Кнопкой Мыши вставить и т. д.

Dhaval Marthak · Accepted Answer · 2016-12-09 01:43:45

попробуйте это:
$("#textbox").bind('paste',function() {alert("Change detected!");});
посмотреть демо на JSFiddle.

Venkat.R · Accepted Answer · 2013-06-26 13:32:45

попробуйте следующий код:

$("#textbox").on('change keypress paste', function() {
  console.log("Handler for .keypress() called.");
});

Kevin Sebastian Fernandez · Accepted Answer · 2016-04-26 07:39:05

чтение ваших комментариев привело меня к грязному исправлению. Это не правильный путь, я знаю, но можно обойти.
$(function() {
    $( "#inputFieldId" ).autocomplete({
        source: function( event, ui ) {
            alert("do your functions here");
            return false;
        }
    });
});