问题抛出:FF下,在输入框的blur事件中无法再让该输入框获取到焦点
代码1:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<script type="text/javascript" src="lib/jquery/jquery-1.3.2.js"></script>
<script type="text/javascript">
function iptBlurEvent(){
$("#div1").append("<p>blur event</p>");
$("#ipt1").focus();
}
function iptFocused() {
$("#div1").append("<p>bt focus event</p>");
}
</script>
</head>
<body>
<input id="ipt1" type="text" οnblur="iptBlurEvent()" οnfοcus="iptFocused()"/>
<div id="div1">
</div>
</body>
</html>
为了测试方便,使用了jquery。对于上面的代码,在输入框随便输入点内容,然后点页面其它地方,这时输入框失去焦点,对于IE和FF,输入的结果是不同的。
在IE下div显示的内容为:
1. focus event
2. blur event
3. focus event
输入框会再次获得焦点。而在FF下div中显示的内容为:
1. focus event
2. blur event
输入框没有再次获得焦点。
下面这个例子能更好地说明问题。代码2:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<script type="text/javascript" src="lib/jquery/jquery-1.3.2.js"></script>
<script type="text/javascript">
function iptBlurEvent(){
$("#div1").append("<p>blur event</p>");
$("#ipt1").focus();
}
function iptClickEvent() {
$("#div1").append("<p>before blur</p>");
$("#bt1").focus();
$("#div1").append("<p>after blur</p>");
}
function btFocused() {
$("#div1").append("<p>button focus event</p>");
}
function iptFocused() {
$("#div1").append("<p>input focus event</p>");
}
</script>
</head>
<body>
<input id="ipt1" type="text" οnblur="iptBlurEvent()" οnclick="iptClickEvent()" οnfοcus="iptFocused()"/>
<input id="bt1" type="button" value="button" οnfοcus="btFocused()"/>
<div id="div1">
</div>
</body>
</html>
这个例子中,在输入框的click事件中让输入框失去焦点让按钮得到焦点。
点击输入框,在IE中,最后得到焦点的是输入框,div显示的结果为:
1. input focus event
2. before blur
3. after blur
4. blur event
5. button focus event
6. input focus event
点击输入框,在FF中,最后得到焦点的是按钮,div显示的结果为:
1. input focus event
2. before blur
3. blur event
4. button focus event
5. after blur
通过Firebug跟踪调试,得出的结论是,输入框的blur事件发生在其它控件focus事件之前,所以在blur事件中设置的其它控件获取焦点无效,目前无法做到兼容。