“input”元素的“change”和“input”事件之间的区别

有人可以告诉我两者之间有什么区别吗change和input事件是？

我正在使用 jQuery 添加它们：

$('input[type="text"]').on('change', function() {
    alert($(this).val());
})

它还适用于input代替change。

也许事件顺序相对于焦点有一些不同？

答案

根据这个帖子：

**oninput**当通过用户界面更改元素的文本内容时，会发生事件。
onchange 当元素的选择、选中状态或内容时发生have changed 。返回（输入）并且值已更改。 <input>,<select>，和<textarea>。

长话短说：

oninput：文本内容所做的任何更改
onchange :
- 如果是<input />：变更 +失去焦点
- 如果是<select>：更改选项

$("input, select").on("input", function () {
    $("pre").prepend("\nOn input. | " + this.tagName + " | " + this.value);
}).on("change", function () {
    $("pre").prepend("\nOn change | " + this.tagName + " | " + this.value);
}).on("focus", function () {
    $("pre").prepend("\nOn focus | " + this.tagName + " | " + this.value);
}).on("blur", function () {
    $("pre").prepend("\nOn blur | " + this.tagName + " | " + this.value);
});

<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>

来自: stackoverflow.com

答案#

答案