获取父div javascript中鼠标单击的位置

我有一个长的矩形div（parent），里面有几个较小的div（child）。我想单击长矩形div（包括子div）上的任意位置，以显示从父div左侧的偏移

目前，这个javascript代码只在我在小div外单击时有效，只要我在子div内单击，它就会显示子div的偏移量。我对javascript非常陌生，似乎找不到相关的答案

我希望有人能帮忙，提前谢谢

window.onload = function(){
    parentDiv.addEventListener('click',function(e){
        alert(e.offsetX);
}, false);

---

您可以使用

getclientracts

方法和

clientX

事件值来获取净偏移坐标：

var offset = this.getClientRects()[0];
alert(e.clientX - offset.left);

---

首先，我建议学习一点DOM事件冒泡和捕获。这是一个DOM的东西，不是一个Javascript的东西，但必须知道。与其在这里重复，不如读一读

因此，当您单击子

div

时，事件首先呈现给触发事件的元素，即子

div

。但是，它没有事件处理程序，因此事件会冒泡到父级

div

。它确实有一个处理程序，通过作为arg

e

传递的事件对象调用该处理程序。不同的浏览器有不同的事件对象实现。因为您使用的是

offsetX

，所以您可能使用的是IE（或Opera），而不是Chrome、Safari或Firefox。据此，

offsetX（）

“设置或检索指针相对于触发事件的对象的位置的x坐标。”。因此，即使父级

div

的事件处理程序正在运行，您也会得到相对于子级的位置，因为它是触发事件的对象

---

由于您是JavaScript新手，我将添加以下内容：由于浏览器之间存在许多不兼容之处，强烈建议您使用JavaScript库来处理这些问题，并提供一个标准化API。你的生活将变得更轻松，你将能够做更多的事情，你的代码将不仅仅适用于IE。IE是一个非常流行的（而且本身非常漂亮）。了解jQuery的规范化。

我解决问题的方法是给child div提供

z-index:-1

parentDiv=document.getElementByClassName（“parentDiv”）；
window.onload=函数（）{
parentDiv.addEventListener（'click'，函数（e）{
警报（e.offsetX）；
}，假）；

在HTML中，我有：

我是个孩子

在css中：

.childDiv{
z指数：-1；
}

你能发布一个提琴吗？在这里发布一个演示，请这里的代码可能是重复的：我发现很难学习javascript，比如像这样的seek函数，我没有其他方法来搜索可能的解决方法，除了直接问，你对可能有用的好的参考有什么建议吗？谢谢。非常适合f或计算已应用变换的元素的位置