JavaScript 实时监听input 中值变化

<input> 标签中,添加属性 oninput ,oninput 事件在元素获得用户输入时发生。
<input><textarea> 元素的值发生改变时,会发生此事件。可以监控的HTML 标签:<input type="color">, <input type="date">, <input type="datetime">, <input type="email">, <input type="month">, <input type="number">, <input type="password">, <input type="range">, <input type="search">, <input type="tel">, <input type="text">, <input type="time">, <input type="url">, <input type="week"> and <textarea>
具体的实现代码
HTML :

<element oninput="myScript()">

其中element 即上面提到的HTML标签
JavaScript:

<script>
function myScript() {
  alert("The value of the input field was changed.");
}
</script>

值得注意的是该属性和onchange 属性是有着很大的区别的,虽然两者都是在input的内容变化后触发,但是它们的触发机制还是有些许的不一样,oninput 属性在元素的内容改变后立即响应,而onchange 属性则是元素失去焦点(通俗一点理解就是点击了其他的元素),并且元素的内容被改变的情况下才会触发,而且onchange 支持select 标签

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐