Question

我试图用JQuery获取div的坐标。我有两个项目; Web表单和Ionic Framework html页面。这两个项目都有以下代码片段：

＆＃13;

$(document).ready(function() {
  $("#draw_area").click(function(e) {
    var parentOffset = $(this).parent().offset();
    var relX = e.pageX - parentOffset.left;
    var relY = e.pageY - parentOffset.top;
    alert("pixel " + relX + ', ' + relY)
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ClsdrawArea" id="draw_area" style="width: 900px; height:900px; background-image: url('images/PathFindingMap.png'); background-repeat: no-repeat; background-size: cover; border: 1px solid red;"></div>

＆＃13;

不幸的是，当我点击同一图像（pathfindingMap图像）上相同的x y位置时，两个项目都给我不同的坐标。我想要的是得到相同的坐标。任何人都可以告诉我如何实现这一目标？谢谢！

修改：在我的网络表单的客户端，没有任何html元素，除了＆＃34; draw_area＆＃34; div和使用parentOffset.left和parentOffset.top，两者都给我值＆＃34; 0＆＃34;。另一方面，在我的离子框架html页面中，它在＆＃34; draw_area＆＃34;之上有以下代码。 DIV：

 <ion-view view-title="">

        <ion-content >
  <ion-scroll zooming="true" overflow-scroll="false" direction="xy" style="width: 100%; height:100%;"
                        scrollbar-x="true" scrollbar-y="true">

使用parentOffset.left给出了值＆＃34; 0＆＃34;但是parentOffset.top给了我＆＃34; 92＆＃34;的值。

是否存在使用JQuery为＆＃34; draw_area＆＃39;提供相同坐标的替代方法？两个项目的div？谢谢！

使用JQuery获取特定div的坐标

0 个答案: