Chrome에는 mousemove에 대한 버그가 있습니다.
1. 클릭 및 컨텍스트 메뉴가 트리거될 때를 포함하여 mouseup 이벤트가 트리거되면 mousemove 이벤트도 트리거됩니다.
2.
현재 제가 생각하는 해결책은 timestamp를 통해 비교하는 것입니다.
var body = document.querySelector("h1"); var timeStamp; body.addEventListener("mousedown", function (e) { console.log("mouse down"); }, false); body.addEventListener("mouseup", function (e) { console.log("mouse up"); timeStamp = e.timeStamp; }) body.addEventListener("mousemove", function (e) { if (!timeStamp || ( e.timeStamp - timeStamp > 10)) { console.log("mouse move"); } })
이렇게 하면 클릭 이벤트가 발생하거나 다음으로 인한 mousemove가 발생하는 것을 방지할 수 있습니다. 마우스 왼쪽 버튼을 mouseup했는데 위에서 설명한 컨텍스트 메뉴로 인한 마우스 이동이 여전히 잘 해결되지 않습니다
완벽한 해결책이 있을까요? 아니면 이 상황을 최대한 피할 수 밖에 없습니다
<input type="text" id="a1" /> $("#a1").mousemove(function(){ if ($(this).data("x") === event.pageX && $(this).data("y") === event.pageY) { return false; } $(this).data({"x":event.pageX, "y":event.pageY}); $(this).after("1"); })
jq를 사용한다는 것은 모든 브라우저에서 .data()를 사용한다는 것입니다. 이것이 사고 방식이므로 스스로 바꿀 수 있습니다.
또한 요소가 mousemove에 바인딩된 후에는 다른 이벤트를 바인딩하지 마세요.
마지막으로: mousemove를 사용하지 마십시오. 너무 많은 리소스를 소모합니다.
마우스다운 위치를 비교하면 이동작업인지 확인할 수 있습니다
document.onmousemove = function(e) { // 不是move操作 if (x === mouseDown.x && y === mouseDown.y) { return false; }}; document.onmousedown = function (e) { mouseDown = { x: e.clientX, y: e.clientY };};
위 내용은 jQuery의 Chrome에서 mousemove 이벤트 버그를 완벽하게 해결하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!