В чем разница между событием" change "и" input " для элемента ввода

Question

В чем разница между событием" change "и" input " для элемента ввода

может кто-нибудь сказать мне, что разница между change и input событий?

я использую jQuery для добавления их:

$('input[type="text"]').on('change', function() {

    alert($(this).val());

})

Он работает с input вместо change.

может быть, какая-то разница в заказе событий относительно фокуса?

584 2

jQuery javascript dom events

2 ответов:

Comments

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

Ionică Bizău · Accepted Answer · 2018-01-26 06:53:19

по данным этот пост:

oninput событие происходит, когда текстовое содержимое элемента изменилось через пользовательский интерфейс.

onchange происходит, когда выбор, проверенное состояние или содержимое элемента изменил. В некоторых случаях это происходит только тогда, когда элемент теряет фокус. Атрибут onchange может использоваться с:<input>, <select> и <textarea>.

TL; DR:

oninput: любые изменения, внесенные в текст

onchange:

если это <input />: изменить + потерять фокус

если это <select>: изменить параметр
$("input, select").on("input", function () {
    $("pre").prepend("\nOn input. | " + this.tagName);
}).on("change", function () {
    $("pre").prepend("\nOn change | " + this.tagName);
}).on("focus", function () {
    $("pre").prepend("\nOn focus | " + this.tagName);
}).on("blur", function () {
    $("pre").prepend("\nOn blur | " + this.tagName);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" />
<select>
  <option>Alice</option>
  <option>Bob</option>
  <option>Carol</option>
  <option>Dave</option>
  <option>Emma</option>
</select>
<pre></pre>

Gabe · Accepted Answer · 2013-06-11 18:16:23

The changeevent срабатывает в большинстве браузеров при изменении содержимого и элемент теряет focus, в основном совокупность изменений. Вы не увидите, что это уволено для каждого измененного в отличие от inputevent.

The inputevent срабатывает синхронно при изменении содержимого для элемент. Таким образом, вы увидите, что это событие происходит чаще. Поддержка браузера варьируется.