使用Javascript鼠标事件返回鼠标在HTML5画布上单击的坐标？

Question

请参阅本网站上的代码

我想返回鼠标单击/移动相对于html5画布的相对坐标.下面的代码是什么意思？

if ( event.layerX ||  event.layerX == 0) { // Firefox
            mouseX = event.layerX ;
            mouseY = event.layerY;
} else if (event.offsetX || event.offsetX == 0) { // Opera
            mouseX = event.offsetX;
            mouseY = event.offsetY;
}

layerX适用于除Opera之外的所有浏览器.offsetX适用于除Firefox以外的所有浏览器

那么我们的意思是,如果event.layerX或event.layerY为0 ...我的意思是event.layerX返回鼠标点击wrt画布的相对坐标.那么这有什么意义呢？

Answer 1

更好的方法是这样的代码:

if ( event.offsetX == null ) { // Firefox
   mouseX = event.originalEvent.layerX;
   mouseY = event.originalEvent.layerY;
} else {                       // Other browsers
   mouseX = event.offsetX;
   mouseY = event.offsetY;
}

它很快,正确,而且

event.layerX和event.layerY在WebKit中被破坏和弃用.它们将在不久的将来从发动机中移除.