在很多情况下,我们需要监测输入框,比如自动提示等。我们熟知的一些input的按键事件并不能满足我们的需求,特别是在输入法开启的状态下,三个浏览器的具体问题如下:
IE:触发keydown和keyup,不触发keypress。能够获得输入值。
Firefox::触发keydown和keypress,不触发keyup。输入值未能获得。在回车后会触发keyup,可获得输入值。
Opera:keydown、keypress和keyup都不触发,输入值也未能获。
幸好我们还有一些秘密武器onpopertychange和oninput。onpopertychange事件只在IE下才有效,oninput事件则支持FF/Opera/Safari/NetScape。这2个事件在输入开启状态下仍然可以捕获输入框的输入动作及其值。
代码演示:
<input type="text" id="inpA" />
<input type="text" id="inpB" />
<script language="javascript" type="text/javascript">
//onpopertychange IE only;
$("inpA").onpropertychange=function(){
change();
}
//oninput for FF/Opera/Safari/NetScape
$("inpA").οninput=function(){
change();
}
function change(){
$("inpB").value = $("inpA").value;
}
function $(id){
return document.getElementById(id);
}
</script>