轉(zhuǎn)自 http://caibaojian.com/toutiao/4360, 原文 司徒正美
原理
Firefox觅捆、Chrome、IE9想暗,IE10 均支持 oninput 事件妇汗,此外所有版本的 IE 均支持 onpropertychange 事件。
oninput 事件在用戶輸入说莫、退格(backspace)杨箭、刪除(delete)、剪切(ctrl + x)储狭、粘貼(ctrl + v)及鼠標(biāo)剪切與粘貼時(shí)觸發(fā)(在 IE9 中只在輸入互婿、粘貼、鼠標(biāo)粘貼時(shí)觸發(fā))辽狈。
onpropertychange 事件在用戶輸入慈参、退格(backspace)、刪除(delete)刮萌、剪切(ctrl + x)驮配、粘貼(ctrl + v)及鼠標(biāo)剪切與粘貼時(shí)觸發(fā)(在 IE9 中只在輸入、粘貼着茸、鼠標(biāo)粘貼時(shí)觸發(fā))(僅 IE 支持)壮锻。
backspace、delete 兩個(gè)按鍵的 keyCode 分別為 8涮阔、46躯保。
oncut 事件在粘貼(ctrl + v)、鼠標(biāo)粘貼時(shí)觸發(fā)澎语。
示例
var input = document.getElementById("test");
function fn() {
// 你要執(zhí)行的代碼
}
if(window.addEventListener) { //先執(zhí)行W3C
input.addEventListener("input", fn, false);
} else {
input.attachEvent("onpropertychange", fn);
}
if(window.VBArray && window.addEventListener) { //IE9
input.attachEvent("onkeydown", function() {
var key = window.event.keyCode;
(key == 8 || key == 46) && fn();//處理回退與刪除
});
input.attachEvent("oncut", fn);//處理粘貼
}