Как получить абсолютную позицию щелчка мыши по событию onClick на теле? - PullRequest
6 голосов
/ 08 июля 2011

Я пытаюсь получить абсолютную позицию (вверху и слева) щелчка мыши относительно браузера / тела, не любых родительских элементов в теле.

У меня естьслушатель привязан к телу, но e.pageX и e.pageY дают мне позицию относительно div.

Обратите внимание, что я могу использовать функции jQuery и YUI.

Кодкоторый в настоящее время не работает правильно:

//getting the position
function _handleClick(e) {
    var data = { absX: e.pageX, absY: e.pageY};
    _logClickData(data);
}

//binding the function
var methods = {
    init: function () {
        $("body").click(_handleClick);
    }
};

Ответы [ 4 ]

8 голосов
/ 08 июля 2011

Комментатор правильный. pageX и pageY дают вам положение мыши относительно всего документа, а не его родительского div. Но если вам интересно, вы можете получить позицию относительно документа из позиции относительно div.

Получить положение родительского элемента div относительно тела, затем добавить два значения.

x = parentdiv.style.left + e.pageX;
y = parentdiv.style.top + e.pageY;



(0,0)
_____________________
|
|
|            __________
|----100----|          |
|           |---60---* |
|           |__________|
|
|
        * = Mouse Pointer

Я сделал диаграмму, потому что это было весело. Не потому, что я чувствовал, что тебе это нужно !!

Также, чтобы вышеперечисленное сработало, вам может понадобиться parseInt.

5 голосов
/ 09 июля 2011

В соответствии с этим (http://docs.jquery.com/Tutorials:Mouse_Position), они должны давать вам абсолютные позиции. offsetX/Y дает вам относительную позицию.

Редактировать ноябрь 2013 : оригинальная "Позиция мыши""ссылка, кажется, не работает, но документация для pageX содержит пример, в котором используется jQuery pageX / Y. Страница о методе offset также содержитсоответствующие примеры.

2 голосов
/ 11 декабря 2017

Если бы я хорошо понял ваш вопрос, это было бы решением

 $("body").click(function(e){
   var parentOffset = $(this).offset(); 
   var relX = e.pageX - parentOffset.left;
   var relY = e.pageY - parentOffset.top;

   window.alert(relX);
   window.alert(relY);
});
0 голосов
/ 09 июля 2011

Решение, на которое ссылается @ Mrchief по ссылке http://docs.jquery.com/Tutorials:Mouse_Position,, заключается в привязке к документу, а не к элементу body.

//binding the function
var methods = {
    init: function () {
        $(document).click(_handleClick);
    }
};
...