js中input標簽內容改變的觸發事件
web前端中經常需要獲取input標簽value值變化的事件。下面幾個事件可以滿足這個需求。
1. onchange事件與onpropertychange事件的區別：
onchange事件在內容改變（兩次內容有可能相等）且失去焦點時觸發；onpropertychange事件是實時觸發，每增加或刪除一個字符就會觸發，通過js改變也會觸發該事件，但是該事件是IE專有。
2. oninput事件與onpropertychange事件的區別：
oninput事件是IE之外的大多數瀏覽器支持的事件，在value改變時實時觸發，但是通過js改變value時不會觸發；onpropertychange事件是任何屬性改變都會觸發，而oninput卻只在value改變時觸發，oninput要通過addEventListener()來注冊，onpropertychange注冊方法與一般事件相同。
3. oninput與onpropertychange失效的情況：
oninput事件：
（1）當腳本中改變value時，不會觸發；
（2）從瀏覽器的自動下拉提示中選取時，不會觸發；
onpropertychange事件：
當input設置為disable=true后，不會觸發。
在value改變時實時觸發實現代碼：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoob.com)</title> </head> <body> <p>在文本框中嘗試輸入觸發函數。</p> <input type="text" id="myInput" oninput="myFunction()" onclick="locationInput"> <p id="demo"></p> <script type="text/javascript"> window.onload = function () { locationInput = function () { .... }; } </script> <script> function myFunction() { var x = document.getElementById("myInput").value; document.getElementById("demo").innerHTML = "你輸入的是: " + x; } </script> </body> </html>