javascript - 将鼠标单击位置推送到Javascript中的数组

Question

我正在尝试将鼠标单击特定元素的坐标推到数组的末尾。这就是我所拥有的：

在头脑中：

var seatsArray = [];

在身体里：

var coordinates = document.getElementById("image");
coordinates.onclick = function(event) {
  seatsArray.push(offsetX, offsetY);
}
document.write("Seats array contains: " + seatsArray + ".");

可能很简单，但我是 javascript 的新手，所以我很感激任何关于它为什么不起作用的帮助！

谢谢

Answer 1

我看到两件事，将您的点击事件更改为：

coordinates.onclick = function(event) {
  event = event || window.event;
  if (!window.event) { // thanks firefox
    event.offsetX = event.layerX;
        event.offsetY = event.layerY;
  } 
  seatsArray.push(event.offsetX, event.offsetY);
}

Firefox offsetX/Y 是layerX/Y，即有一个全局事件对象。

但是，如果您没有全局坐标，请尝试以下操作：

coordinates.onclick = function(e) {
e = e || window.event;

if (e && e.pageX && e.pageY) {
            e.posX = e.pageX;
            e.posY = e.pageY;

        } else if (e && e.clientX && e.clientY) {
            var scr     = {x:0,y:0},
                object  = e.srcElement || e.target;
            //legendary get scrolled
            for (;object.parentNode;object = object.parentNode) {
                scr['x'] += object.scrollLeft;
                scr['y'] += object.scrollTop;
            } 
            e.posX = e.clientX + scr.x;
            e.posY = e.clientY + scr.y;
        } 
 seatsArray.push(e.posX, e.posY);
}