JavaScript: احصل على موضع الماوس بالنسبة للعنصر الأصل

Question

هل هناك أي طريقة للحصول على وضع الماوس بالنسبة لعنصر الوالدين؟

دعنا نقول أن لدي هيكل:

<div id="parent">
    <span class="dot"></span>
</div>

عندما أحضر الماوس الخاص بي span العنصر الذي أحتاجه للحصول على موقعه بالنسبة للعنصر الأم (<div id="parent">). Pagex/ClientX أعطني موضعًا بالنسبة إلى منطقة الصفحة/العميل ، لذلك لا يعمل معي.

Answer 1

قم بطرح موضع العنصر الأصل (OffsetLeft ؛ Offsettop) من موضع الماوس (Pagex ؛ Pagey) للحصول على موضع نسبي. تذكر أن تأخذ OffsetParent في الاعتبار إذا كان لديك مستويات متعددة من التعويضات.

علي سبيل المثال:

element.addEventListener("mousedown", function (e) {
  let x = e.pageX - parent.offsetLeft;
  let y = e.pageY - parent.offsetTop;

  console.log(x, y);
});

أين element هل العنصر الداخلي الخاص بك يتلقى الحدث ، و parent هو المرجع الخاص بك المطلوب للإحداثيات.

Answer 2

jQuery Offset () الطريقة تتعامل مع المواقع الوالدين ، لذلك

function onsomemouseevent(e) {
    var x = e.pageX - $(e.target).offset().left;
}

هو متصفح عادي مستخلص jQuery.

Answer 3

جرب خاصية الإزاحة.http://help.dottoro.com/ljetdvkl.php

جرب هذا: positionx = document.getElementById ('ChildId'). OffSetParent.OffSetLeft ؛ positiony = document.getElementById ('ChildId'). OffSetParent.OffSetLeft ؛