javascript如何捕捉IE窗口失去焦点事件
window.onblur和window.onfocus事件,在FireFox、Opera、Chrome、Safari下就非常正确,但在IE就根本不正常。IE下,焦点从b...
window.onblur和window.onfocus事件,在FireFox、Opera、Chrome、Safari下就非常正确,但在IE就根本不正常。
IE下,焦点从body和其它元素例如input、textarea切换时,IE竟然触发window.onblur或者window.onfocus事件。
window对象我试过换成document.body和this,甚至去掉,结果一样。
求IE下javascript捕捉窗口失去焦点和得到焦点的真正方法。能兼容其它浏览器最好。先谢过了!
失去焦点是因为切换到别的应用程序或别的web页面。
我想要的效果,是web窗口失去焦点时停止js的倒计时,web窗口再次获得焦点时恢复倒计时。
FireFox用window.onblur()一句语句就很好地解决了问题,很容易理解也运行地很好,IE在页面没有别的输入元素时也很正常,但页面有多个输入元素的复杂情况下就死活都不正常。太鄙视IE了。
el13说的jquery我也有听过,extjs也用过一点,但是都要载入一些js文件,为了这个问题而劳师动众,有点搞得复杂了。
IE下面有没有像window.onblur()那样的简洁方法?如果没有,我真的宁愿放弃这个效果了。
1,2,3,4楼的朋友,感谢关注,不过还是没有满意的答案,继续悬赏中。 展开
IE下,焦点从body和其它元素例如input、textarea切换时,IE竟然触发window.onblur或者window.onfocus事件。
window对象我试过换成document.body和this,甚至去掉,结果一样。
求IE下javascript捕捉窗口失去焦点和得到焦点的真正方法。能兼容其它浏览器最好。先谢过了!
失去焦点是因为切换到别的应用程序或别的web页面。
我想要的效果,是web窗口失去焦点时停止js的倒计时,web窗口再次获得焦点时恢复倒计时。
FireFox用window.onblur()一句语句就很好地解决了问题,很容易理解也运行地很好,IE在页面没有别的输入元素时也很正常,但页面有多个输入元素的复杂情况下就死活都不正常。太鄙视IE了。
el13说的jquery我也有听过,extjs也用过一点,但是都要载入一些js文件,为了这个问题而劳师动众,有点搞得复杂了。
IE下面有没有像window.onblur()那样的简洁方法?如果没有,我真的宁愿放弃这个效果了。
1,2,3,4楼的朋友,感谢关注,不过还是没有满意的答案,继续悬赏中。 展开
5个回答
展开全部
你说的是从form元素切换的时候...会自动检查数据..那样blur就触发window.onblur是吧....
我估计你是不是这样写的:
<script>
//error this -> window
function checkform(){
if(this.value==""){
this.focus();
this.className="highlight";
}
}
</script>
<style>
.highlight{
border:1px solid red;
background:yellow;
}
</style>
</head>
<body>
<form>
Name:<input id="name" size=20 onblur="checkform(this);"><br/>
Email:<input id="email" size=20>
</form>
</body>
这样传递this确实会传进去..但是这里不可以在函数里再次使用this..否则..this就会指向window...这个有点特殊要涉及到JS的上下文对象的问题..我记得有一次也有个人问这个问题的...
当this在script标签中出现的时候..它就会出现这个上下文对象的问题...这个时候的this总是指向包围它的那个对象...比如...
利用加载后触发事件:
window.onload=function(){
document.getElementById("name").onblur=function(){
if(this.value==""){
this.focus();
this.className="highlight";
}
}
}
</script>
<style>
.highlight{
border:1px solid red;
background:yellow;
}
</style>
</head>
<body>
<form>
Name:<input id="name" size=20><br/>
Email:<input id="email" size=20>
</form>
</body>
这个时候..当窗口加载完成后..它执行..查找ID为XX的元素...然后当这个元素blur的时候..这个时候..利用匿名函数..this就会指向ID的这个元素...
也就是说...当想让this指向一个元素的时候...这个对象必须包围this..产生上下文对象..否则..this总是指向window...
如..
<script>
var foo="check";
alert(this.foo);
//display "check"
</script>
此时this就指向window...
这个代码这样写也是可以的..
window.onload=function(){
document.getElementById("name").onblur=checkform;
}
function checkform(){
if(this.value==""){
this.focus();
this.className="highlight";
}
}
这样..this还是指向id的元素...
象你利用this传递值后....必须指定另一个形参来接受它这个值..因为function它是在全局状态下定义的...function此时就是window的一个方法而已...
比如这样写..
<script>
function checkform(elem){
if(elem.value==""){
elem.focus();
elem.className="highlight";
}
}
</script>
<style>
.highlight{
border:1px solid red;
background:yellow;
}
</style>
</head>
<body>
<form>
Name:<input id="name" size=20 onblur="checkform(this);"><br/>
Email:<input id="email" size=20>
</form>
</body>
</html>
我估计你是不是这样写的:
<script>
//error this -> window
function checkform(){
if(this.value==""){
this.focus();
this.className="highlight";
}
}
</script>
<style>
.highlight{
border:1px solid red;
background:yellow;
}
</style>
</head>
<body>
<form>
Name:<input id="name" size=20 onblur="checkform(this);"><br/>
Email:<input id="email" size=20>
</form>
</body>
这样传递this确实会传进去..但是这里不可以在函数里再次使用this..否则..this就会指向window...这个有点特殊要涉及到JS的上下文对象的问题..我记得有一次也有个人问这个问题的...
当this在script标签中出现的时候..它就会出现这个上下文对象的问题...这个时候的this总是指向包围它的那个对象...比如...
利用加载后触发事件:
window.onload=function(){
document.getElementById("name").onblur=function(){
if(this.value==""){
this.focus();
this.className="highlight";
}
}
}
</script>
<style>
.highlight{
border:1px solid red;
background:yellow;
}
</style>
</head>
<body>
<form>
Name:<input id="name" size=20><br/>
Email:<input id="email" size=20>
</form>
</body>
这个时候..当窗口加载完成后..它执行..查找ID为XX的元素...然后当这个元素blur的时候..这个时候..利用匿名函数..this就会指向ID的这个元素...
也就是说...当想让this指向一个元素的时候...这个对象必须包围this..产生上下文对象..否则..this总是指向window...
如..
<script>
var foo="check";
alert(this.foo);
//display "check"
</script>
此时this就指向window...
这个代码这样写也是可以的..
window.onload=function(){
document.getElementById("name").onblur=checkform;
}
function checkform(){
if(this.value==""){
this.focus();
this.className="highlight";
}
}
这样..this还是指向id的元素...
象你利用this传递值后....必须指定另一个形参来接受它这个值..因为function它是在全局状态下定义的...function此时就是window的一个方法而已...
比如这样写..
<script>
function checkform(elem){
if(elem.value==""){
elem.focus();
elem.className="highlight";
}
}
</script>
<style>
.highlight{
border:1px solid red;
background:yellow;
}
</style>
</head>
<body>
<form>
Name:<input id="name" size=20 onblur="checkform(this);"><br/>
Email:<input id="email" size=20>
</form>
</body>
</html>
展开全部
window.onblur = function (e) {
e = e || window.event;
if (window.ActiveXObject && /MSIE/.test(navigator.userAgent)) { //IE
//如果 blur 事件是窗口内部的点击所产生,返回 false, 也就是说这是一个假的 blur
var x = e.clientX;
var y = e.clientY;
var w = document.body.clientWidth;
var h = document.body.clientHeight;
if (x >= 0 && x <= w && y >= 0 && y <= h) {
window.focus();
return false;
}
}
}
e = e || window.event;
if (window.ActiveXObject && /MSIE/.test(navigator.userAgent)) { //IE
//如果 blur 事件是窗口内部的点击所产生,返回 false, 也就是说这是一个假的 blur
var x = e.clientX;
var y = e.clientY;
var w = document.body.clientWidth;
var h = document.body.clientHeight;
if (x >= 0 && x <= w && y >= 0 && y <= h) {
window.focus();
return false;
}
}
}
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
用jquery吧,都封装好了,浏览器兼容性很好。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
window.onblur
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<html>
<head>
<script type="text/javascript">
function tests(){
alert("我失去焦点了!");
}
</script>
</head>
<body onblur=tests()>
</body>
<html>
<head>
<script type="text/javascript">
function tests(){
alert("我失去焦点了!");
}
</script>
</head>
<body onblur=tests()>
</body>
<html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询