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

有人能告诉我change和input事件之间的区别是什么？

我正在使用jQuery添加它们：

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

它也适用于input而不是change 。

也许在相关焦点的事件排序方面存在一些差异？

Answer 1

根据这篇文章 ：

• 当通过用户界面更改元素的文本内容时，会发生oninput事件。

• 当选择，检查状态或元素的内容发生变化时，会发生onchange 。 在某些情况下，它仅在元素失去焦点时发生。 onchange属性可以与： ， 和 。

TL; DR：

• oninput ：文本内容中的任何更改
• onchange ：
  • 如果是 ：更改+失去焦点
  • 如果是 ：更改选项

 $("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); }); 

    Alice Bob Carol Dave Emma  

 

Answer 2

• 当内容发生更改且元素失去focus ， change event在大多数浏览器中触发，基本上是更改的集合。 与input event不同，您不会看到每次更改都会触发此操作。

• input event在元素内容更改时同步触发。 所以你会看到这个事件更频繁地发生。 浏览器支持各不相