首页 » JavaScript » screenX与screenY

screenX与screenY

鼠标事件发生时,不仅会有相对于浏览器窗口的位置,还有一个相对于整个电脑屏幕的位置。而通过screenX和screenY属性就可以确定鼠标事件发生时鼠标指针相对于整个屏幕的坐标信息。

可以使用类似下面的代码取得鼠标事件的屏幕坐标:

var EventUtil = {
    getEvent: function (event) {
        return event ? event : window.event;
    },
    addHandler: function (element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    }
};
var div = document.getElementById("myDiv");
EventUtil.addHandler(div, "click", function (event) {
    event = EventUtil.getEvent(event);
    alert("Screen coordinates: " + event.screenX + "," + event.screenY);
});

与前一篇文章中的例子类似,这里也是为<div>元素指定了一个onclick事件处理程序。当这个元素被单击时,就会显示出事件的屏幕坐标信息了。

此文章发表在 JavaScript. 将 固定链接 加入收藏.