如何实时跟踪文本字段中的输入变化？

在您键入时跟踪文本字段中的输入更改

与常见的误解不同，input type="text" onchange 事件在离开时触发控制（模糊）。要跟踪发生的更改，请考虑利用 HTML5 的 oninput 事件。

oninput 的优点：

• 感觉就像 onchange，但不会失去对元素的焦点。
• 跨浏览器广泛支持，包括移动设备，IE8 和

实现：

对于 IE 以外的浏览器，只需为 oninput 事件添加一个事件监听器即可：

document.getElementById('source').addEventListener('input', inputHandler);

对于 IE8，包含 onpropertychange 的事件侦听器，如下所示好：

document.getElementById('source').addEventListener('propertychange', inputHandler);

其他注意事项：

虽然 oninput 在大多数情况下是可靠的，但它对某些输入有限制：

• 选择选项： Firefox/Edge18-/IE9 不会触发选择选项的输入更改。
• 右键单击粘贴：使用 onkey* 事件并不理想，因为可以通过右键单击和粘贴来更改内容。

在这些中在这种情况下，可能的解决方法是使用 setTimeout 函数手动执行更改跟踪。虽然不那么优雅，但仍然可以有效捕获变化。

以上是如何实时跟踪文本字段中的输入变化？的详细内容。更多信息请关注PHP中文网其他相关文章！