Как я могу отслеживать события перемещения мыши в JavaScript, когда курсор находится вне целевого элемента? - PullRequest
0 голосов
/ 19 сентября 2018

Я могу получить события движения мыши в javascript, используя простую функцию:

myElement.onmousemove(function(event){
  // ...
});

, но я думаю, что эти события срабатывают, только когда курсор находится над элементом.Я знаю, что могу также сделать это для document и получить все события движения мыши:

document.onmousemove(function(event){...});

Однако это событие не имеет «области действия», принадлежащей элементу div или кнопке или чему-либо еще, ине будет иметь смещения относительно элемента, с которым я работаю.

Мой обходной путь - сохранить переменную, указывающую на сфокусированный элемент div, и ссылаться на нее при получении всех событий движения, но я бы предпочел получитьсобытия движения и функция onmousemove, установленные для самого элемента.Есть ли способ для этого элемента продолжать получать события перемещения мыши, даже если курсор покидает границу элемента?

В случае, если это имеет значение, я могу использовать jQuery, но я бы предпочел нативное решение.

1 Ответ

0 голосов
/ 19 сентября 2018

нет, невозможно получить событие mousemove, когда движение находится за пределами присоединенного элемента.Как вы указали правильно, вы можете отслеживать движение на документе.При использовании этого вместе с событиями mouseenter и mouseleave вы можете установить / отменить переменную, чтобы указать, происходят ли движения элемента или нет.

например,

var myElement = document.getElementById("special");
var isOverMyElement = false;
document.addEventListener('mousemove', function(e){
    if (isOverMyElement){
        console.log("mouse is within myelement at details", e);
    }
})
myElement.addEventListener('mousenter', function(e){
    isOverMyElement = true;
})
myElement.addEventListener('mousenter', function(e){
    isOverMyElement = false;
})

Если вы ориентируетесь на старые браузеры, используйте jQuery, поскольку он нормализует ввод мыши / оставление над браузерами.Если вы ориентируетесь на современные браузеры, нет необходимости в jQuery

...