javascript - 如何找到与子元素相关的父元素上的click事件的坐标？

我有以下代码，我正在尝试寻找一种方法，以便在div（父）元素上单击时，可以获取相对于元素画布的单击坐标。

到目前为止，这是我的代码：

<!doctype html>
<html>
   <body>
       <div  id=canvas_div>
            <canvas width = "500" height = "500" ></canvas>
       </div>


      <script>    
       function printMousePos(event) {
            document.body.textContent =
            "Position x: " + event.clientX +
          " - Position y: " + event.clientY;
                   }

      document.addEventListener("click", printMousePos);        
      </script>
   </body>
</html>

这将返回事件的x和y位置，但不返回画布位置的相对X / Y。有人可以帮我吗？我是JS新手，所以我不知道该怎么做

如何找到与子元素相关的父元素上的click事件的坐标？

0 个答案: