source

마우스 이벤트 없이 jQuery에서 마우스 위치를 얻는 방법은 무엇입니까?

ittop 2023. 9. 4. 20:41
반응형

마우스 이벤트 없이 jQuery에서 마우스 위치를 얻는 방법은 무엇입니까?

현재 마우스 위치를 얻고 싶지만 사용하지 않습니다.

$(document).bind('mousemove',function(e){ 
        $("#log").text("e.pageX: " + e.pageX + ", e.pageY: " + e.pageY); 
}); 

왜냐하면 나는 단지 그 자리를 얻고 정보를 처리하기만 하면 되기 때문입니다.

마우스 위치를 쿼리할 있는 방법이 없다고 생각하지만 다음을 사용할 수 있습니다.mousemove저장된 정보를 쿼리할 수 있도록 정보를 저장하는 핸들러입니다.

jQuery(function($) {
    var currentMousePos = { x: -1, y: -1 };
    $(document).mousemove(function(event) {
        currentMousePos.x = event.pageX;
        currentMousePos.y = event.pageY;
    });

    // ELSEWHERE, your code that needs to know the mouse position without an event
    if (currentMousePos.x < 10) {
        // ....
    }
});

하지만 거의 모든 코드는,setTimeout코드 등은 이벤트에 대한 응답으로 실행되며 대부분의 이벤트는 마우스 위치를 제공합니다.마우스가 어디에 있는지 알아야 하는 코드는 이미 해당 정보에 액세스할 수 있습니다.

이벤트를 사용하지 않고는 jQuery에서 마우스 위치를 읽을 수 없습니다.먼저 주의할 점은event.pageX그리고.event.pageY속성은 모든 이벤트에 존재하므로 다음 작업을 수행할 수 있습니다.

$('#myEl').click(function(e) {
    console.log(e.pageX);
});

다른 옵션은 마우스 이동 핸들러에 의해 업데이트된 변수에 대한 전체 코드 액세스를 제공하기 위해 폐쇄를 사용하는 것입니다.

var mouseX, mouseY;
$(document).mousemove(function(e) {
    mouseX = e.pageX;
    mouseY = e.pageY;
}).mouseover(); // call the handler immediately

// do something with mouseX and mouseY

다음 방법을 사용했습니다.

$(document).mousemove(function(e) {
    window.x = e.pageX;
    window.y = e.pageY;
});

function show_popup(str) {
    $("#popup_content").html(str);
    $("#popup").fadeIn("fast");
    $("#popup").css("top", y);
    $("#popup").css("left", x);
}

이렇게 하면 항상 위쪽으로부터의 거리는 y로 저장되고 왼쪽으로부터의 거리는 x로 저장됩니다.

게다가.mousemove브라우저 창에서 드래그 앤 드롭을 수행하는 경우 이벤트가 트리거되지 않습니다.드래그 앤 드롭 중에 마우스 좌표를 추적하려면 다음에 대한 처리기를 연결해야 합니다.document.ondragover이벤트 및 원래 이벤트 속성을 사용합니다.

예:

var globalDragOver = function (e)
{
    var original = e.originalEvent;
    if (original)
    {
        window.x = original.pageX;
        window.y = original.pageY;
    }
}

사용하다window.event마지막을 포함합니다.event그리고 어느 것이나event포함하다pageX,pageY등. Chrome, Safari, IE에는 작동하지만 FF에는 작동하지 않습니다.

var CurrentMouseXPostion;
var CurrentMouseYPostion;

$(document).mousemove(function(event) {
    CurrentMouseXPostion = event.pageX;
    CurrentMouseYPostion = event.pageY;
});

메인 객체에 eventListener를 만듭니다. 문서 객체의 경우, 마우스가 모든 프레임을 조정하고 전역 변수에 저장할 수 있습니다. 원하는 시간에 원하는 장소에서 마우스 Y&Z를 읽을 수 있습니다.

우연히 이걸 발견했어요, 공유하면 좋을 것 같아요.

여러분은 어떻게 생각하세요?

$(document).ready(function() {
  window.mousemove = function(e) {
    p = $(e).position();  //remember $(e) - could be any html tag also.. 
    left = e.left;        //retrieving the left position of the div... 
    top = e.top;          //get the top position of the div... 
  }
});

그리고 붐, 우리는 그것을 가지고 있습니다.

언급URL : https://stackoverflow.com/questions/4517198/how-to-get-mouse-position-in-jquery-without-mouse-events

반응형