值更改时的 HTML 输入
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2826242/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML Input on change of value
提问by arik
I have an input tag. This tag does not have the autocomplete feature turned off, thus, one does not necessarily need to release a key to change the value of this field and focus another one. My question is: how can I detect ANY value changes of this particular field, like e. g.
我有一个输入标签。这个标签没有关闭自动完成功能，因此，一个人不一定需要释放一个键来改变这个字段的值并聚焦另一个。我的问题是：如何检测此特定字段的任何值更改，例如
<input onvaluechange="//do following..." />
The JavaScript attribute onchangedoes not fire on change of value, only on changes like blur, focus, etc...
JavaScript 属性onchange不会在值更改时触发，只会在模糊、焦点等更改时触发...
EDIT: It also doesn't necessarily be a key press. Due to the autocompletion, the user can simply mouse-click the autocompletion result to change the value. This would not fire an onkeydownevent.
编辑：它也不一定是按键。由于自动完成，用户可以简单地用鼠标单击自动完成结果来更改值。这不会触发onkeydown事件。
回答by bobince
It also doesn't necessarily be a key press. Due to the autocompletion
它也不一定是按键。由于自动完成
...and many other non-key-based operations, such as right-click-cut/paste, drag and drop, undo/redo, spellchecker adjustments and so on.
...以及许多其他非基于键的操作，例如右键单击剪切/粘贴、拖放、撤消/重做、拼写检查调整等。
HTML5 defines an oninputevent to catch all direct changes.
HTML5 定义了一个oninput事件来捕获所有直接更改。
Unfortunately browser support today isn't there (no support in IE, and there are some bugs in others), so all you can do if you really need to detect all changes to an input value earlier than onchangeis to use setIntervalto add a poller that constantly compares against the previous value.
不幸的是今天的浏览器支持是不存在（在IE浏览器的支持，并有在其他一些bug），因此所有的，如果你真的需要早期检测所有更改的输入值比你能做的onchange就是用setInterval添加一个轮询说不断地与之前的值进行比较。
回答by tmadsen
回答by ThatGuy
I had a similar problem and binding to a dozen of different events just doesn't cut it, since there are so many different ways of changing input value, as bobincenoted.
我遇到了类似的问题，绑定到十几个不同的事件并不能解决问题，因为正如bobince指出的那样，有很多不同的方法可以改变输入值。
So - I ended up writing dead simple jQuery monitoring plugin that's generic in nature. With it you can monitor input value changes, textarea text changes, div content changes, etc:
所以 - 我最终编写了非常简单的 jQuery 监控插件，它本质上是通用的。使用它您可以监控输入值变化、textarea 文本变化、div 内容变化等：
https://github.com/nixd3v/monitor
https://github.com/nixd3v/monitor
Tracking div content changes:
跟踪 div 内容更改：
$.monitor('add', function(){return $("div#someDiv").html()}, function(){
console.log('Div content changed');
});
Tracking input value changes:
跟踪输入值变化：
$.monitor('add', function(){return $("#password").val()}, function(){
console.log('input value changed');
});
It also uses a loop of course, however, not through setInterval, but rather through using setTimeout along with a self-executing anonymous function:
当然，它也使用循环，但不是通过setInterval，而是通过使用 setTimeout 和自执行匿名函数：
(function(){
// do some stuff
setTimeout(arguments.callee, 100);
})();
What this does - this guarantees, that the next call is not made before your code was executed. If you use polling in your code - this is the right way of doing it.
这是做什么的 - 这保证了在您的代码执行之前不会进行下一次调用。如果您在代码中使用轮询 - 这是正确的做法。
回答by Tim
You can use the onKeyPressattribute to monitor changes typed in by the user.
您可以使用该onKeyPress属性来监视用户输入的更改。
For example:
例如：
<input type='input' onKeyPress='SomeScriptMethod();'>
