onpropertychange能夠捕獲每次輸入值的變化。
例如:對象的value值被改變時,onpropertychange能夠捕獲每次改變,而onchange需要執行某個事件才可以捕獲。
在文本框輸入數據的時候,當鍵盤按下並放開的時候可以使用onkeyup來檢測事件,onpropertychange能夠捕獲每次改變,而onchange需要執行某個事件才可以捕獲。可是有的時候我們輸入數據是采用粘貼的方式而不是鍵盤輸入,這就需要實時檢測文本框狀態的改變。
onpropertychange 不被firefox所支持,如果想在firefox下正常使用,需要用oninput屬性,且需要用addEventListener來注冊事件。
寫法:
<div id="msg"></div>
<input id='txt' value="" />
<script type="text/javascript">
//當狀態改變的時候執行的函數
function handle() {
document.getElementById('msg').innerHTML = '輸入的文字長度為:' + document.getElementById('txt').value.length;
}
//firefox下檢測狀態改變只能用oninput,且需要用addEventListener來注冊事件。
if (/msie/i.test(navigator.userAgent)) //ie瀏覽器
{
document.getElementById('txt').onpropertychange = handle
}
else {//非ie瀏覽器,比如Firefox
document.getElementById('txt').addEventListener("input", handle, false);
}
</script>