javascript检测clientX与clientY客户区坐标位置

发布时间:2019-07-15编辑:脚本学堂
本文介绍下,javascript获取clientX与clientY客户区坐标位置的方法,有需要的朋友参考下吧。

我们知道,鼠标事件都是在浏览器视口中的特定位置上发生的。
这个位置信息保存在事件对象的clientX和clientY属性中。
所有浏览器都支持这两个属性,它们的值表示事件发生时鼠标指针在视口中的水平和垂直坐标。

例子,取得鼠标事件的客户端坐标信息:

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(" Click coordinates: " + event.clientX + "," + event.clientY);
});

这里为一个<div>元素指定了onclick事件 处理程序。
当用于点击这个元素时,就会看到事件的客户端坐标信息。
注意,这些值不包括页面滚动的距离,因此这个位置并不表示鼠标在页面上的位置。