HTML5 標準事件 oninput 和 IE 專屬事件 onpropertychange 事件實時監聽輸入框value的變化

oninput 事件在用戶輸入時觸發。

該事件在 <input> 或 <textarea> 元素的值發生改變時觸發。

提示： 該事件類似于 onchange 事件。不同之處在于 oninput 事件在元素值發生變化是立即觸發， onchange 在元素失去焦點時才會觸發。另外一點不同是 onchange 事件也可以作用于 <keygen> 和 <select> 元素。

oninput 支持的HTML標簽：<input type="password"><input type="search"><input type="text"><textarea>

瀏覽器支持：

Chrome	fireFox	Safari	IE	Opera
Yes	4.0	5.0	9.0	Yes

?

?

示例：

HTML:<input type="text" oninput="onInput()">JavaScript：<script type="text/javascript">function onInput() {console.log("正在輸入...");}</script>或HTML：<input type="text">JavaScript：<script type="text/javascript">var oInput = document.querySelector("input");oInput.oninput = function () {console.log("正在輸入...");};</script>或HTML：<input type="text">JavaScript：<script type="text/javascript" src="jquery.min.js"></script><script type="text/javascript">$("input").on("input", function () {console.log("正在輸入...");});</script>或<script type="text/javascript">// 同時綁定 input propertychange$('input').bind('input propertychange', function() {console.log("正在輸入...");});</script>

?

更多專業前端知識，請上 【猿2048】www.mk2048.com

總結

以上是生活随笔為你收集整理的实时监听input输入框value的变化：的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。