是否有可能获得鼠标位置与JavaScript页面加载后,没有任何鼠标移动事件(不移动鼠标)?
当前回答
您可以为光标的x和y坐标创建变量,每当鼠标移动时更新它们,并在间隔内调用一个函数来对存储的位置执行所需的操作。
当然,这样做的缺点是,至少需要一次初始鼠标移动才能使其工作。只要游标至少更新一次位置,无论它是否再次移动,我们都能够找到它的位置。
var cursor_x = -1;
var cursor_y = -1;
document.onmousemove = function(event)
{
cursor_x = event.pageX;
cursor_y = event.pageY;
}
setInterval(check_cursor, 1000);
function check_cursor(){console.log('Cursor at: '+cursor_x+', '+cursor_y);}
上面的代码每秒更新一次,并显示光标所在的位置。
其他回答
我设想,也许您有一个带有计时器的父页面,在一定时间或任务完成后,您将用户转发到一个新页面。现在你想要光标的位置,因为它们在等待,所以它们不一定会碰到鼠标。因此,使用标准事件跟踪父页面上的鼠标,并通过get或post变量将最后一个值传递给新页面。
你可以在你的父页上使用JHarding的代码,这样最新的位置总是在全局变量中可用:
var cursorX;
var cursorY;
document.onmousemove = function(e){
cursorX = e.pageX;
cursorY = e.pageY;
}
这将无法帮助通过父页面以外的方式导航到此页面的用户。
这是我的解决方案。它导出窗口。currentMouseX和window。你可以在任何地方使用currentMouseY属性。它首先使用悬停元素的位置(如果有的话),然后监听鼠标移动来设置正确的值。
(function () {
window.currentMouseX = 0;
window.currentMouseY = 0;
// Guess the initial mouse position approximately if possible:
var hoveredElement = document.querySelectorAll(':hover');
hoveredElement = hoveredElement[hoveredElement.length - 1]; // Get the most specific hovered element
if (hoveredElement != null) {
var rect = hoveredElement.getBoundingClientRect();
// Set the values from hovered element's position
window.currentMouseX = window.scrollX + rect.x;
window.currentMouseY = window.scrollY + rect.y;
}
// Listen for mouse movements to set the correct values
window.addEventListener('mousemove', function (e) {
window.currentMouseX = e.pageX;
window.currentMouseY = e.pageY;
}, /*useCapture=*/true);
}())
来源:https://github.com/ocproducts/composr/commit/a851c19f925be20bc16bfe016be42924989f262e#diff-b162dc9c35a97618a96748639ff41251R1202
你可以尝试一些类似Tim Down建议的东西——但不是为屏幕上的每个像素设置元素,而是只创建2-4个元素(框),并动态更改它们的位置、宽度和高度,递归地将屏幕上可能的位置除以2-4,从而快速找到鼠标的真实位置。
例如,第一个元素占据屏幕的左右半部分,然后是上下半部分。到目前为止,我们已经知道鼠标位于屏幕的哪四分之一,能够重复—发现这个空间的哪四分之一……
编辑2020:这不再工作。看起来是这样,浏览器供应商修补了这个问题。因为大多数浏览器都依赖于chromium,所以它可能位于浏览器的核心。
旧的回答: 您还可以钩子mouseenter(当mousecursor在页面内时,该事件在页面重新加载后触发)。扩展损坏的代码应该做的伎俩:
Var x = null; Var y = null; 文档。addEventListener(' mouemove ', onMouseUpdate, false); 文档。addEventListener('mouseenter', onMouseUpdate, false); 函数onMouseUpdate(e) { x = e.pageX; y = e.pageY; console.log (x, y); } 函数getMouseX() { 返回x; } 函数getMouseY() { 返回y; }
你也可以在mouseleave-event上设置x和y为空。你可以用光标检查用户是否在你的页面上。
不是鼠标位置,但是,如果你正在寻找当前光标位置(用例,如获取最后键入的字符等),那么,下面的代码片段工作良好。 这将为您提供与文本内容相关的游标索引。
window.getSelection().getRangeAt(0).startOffset