如何检测当鼠标离开窗口? [英] How can I detect when the mouse leaves the window?

查看:98
本文介绍了如何检测当鼠标离开窗口?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我希望能够当鼠标离开窗口,所以我可以从发射,而用户的鼠标在别处停止事件检测。

I want to be able to detect when the mouse leaves the window so I can stop events from firing while the user's mouse is elsewhere.

如何做到这一点任何想法?

Any ideas of how to do this?

推荐答案

这类型的行为,而在HTML页面中实现拖放行为通常期望的。该解决方案如下于IE 8.0.6,3.6.6火狐,歌剧10.53,和Safari 4的MS Windows XP计算机上进行测试。结果
从彼得·保罗·科赫首先一点功能;跨浏览器的事件处理程序:

This type of behavior is usually desired while implementing drag-drop behavior on an html page. The solution below was tested on IE 8.0.6, FireFox 3.6.6, Opera 10.53, and Safari 4 on an MS Windows XP machine.
First a little function from Peter-Paul Koch; cross browser event handler:

function addEvent(obj, evt, fn) {
    if (obj.addEventListener) {
        obj.addEventListener(evt, fn, false);
    }
    else if (obj.attachEvent) {
        obj.attachEvent("on" + evt, fn);
    }
}

然后用这个方法将事件处理程序附加到文档对象mouseout事件:

And then use this method to attach an event handler to the document objects mouseout event:

addEvent(document, "mouseout", function(e) {
    e = e ? e : window.event;
    var from = e.relatedTarget || e.toElement;
    if (!from || from.nodeName == "HTML") {
        // stop your drag event here
        // for now we can just use an alert
        alert("left window");
    }
});

最后,这里是嵌入式调试脚本的HTML页面:

Finally, here is an html page with the script embedded for debugging:

<html>
<head>
<script type="text/javascript">
function addEvent(obj, evt, fn) {
    if (obj.addEventListener) {
        obj.addEventListener(evt, fn, false);
    }
    else if (obj.attachEvent) {
        obj.attachEvent("on" + evt, fn);
    }
}
addEvent(window,"load",function(e) {
    addEvent(document, "mouseout", function(e) {
        e = e ? e : window.event;
        var from = e.relatedTarget || e.toElement;
        if (!from || from.nodeName == "HTML") {
            // stop your drag event here
            // for now we can just use an alert
            alert("left window");
        }
    });
});
</script>
</head>
<body></body>
</html>

这篇关于如何检测当鼠标离开窗口?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆