js 判断鼠标不动

在JavaScript中判断鼠标是否不动，通常可以通过监听鼠标的mousemove事件，并记录鼠标的位置和时间戳，然后通过定时器定期检查鼠标位置是否发生变化以及时间间隔是否超过设定的阈值。以下是实现这一功能的基本步骤和示例代码：

基本概念

事件监听：使用JavaScript为DOM元素添加事件监听器，以便在特定事件（如鼠标移动）发生时执行代码。
定时器：使用setTimeout或setInterval来定期执行检查鼠标是否不动的逻辑。
时间戳和位置记录：记录上一次鼠标移动的时间戳和位置，以便与当前的状态进行比较。

实现步骤

监听mousemove事件，记录每次鼠标移动的时间戳和位置。
使用定时器定期检查当前时间和位置与上一次记录的是否相同。
如果超过设定的时间阈值且位置未变，则认为鼠标不动。

示例代码

let lastMousePosition = { x: 0, y: 0 };
let lastMouseMoveTime = Date.now();
const inactivityThreshold = 2000; // 2秒

// 监听鼠标移动事件
document.addEventListener('mousemove', (event) => {
    lastMousePosition = { x: event.clientX, y: event.clientY };
    lastMouseMoveTime = Date.now();
});

// 定期检查鼠标是否不动
setInterval(() => {
    const currentTime = Date.now();
    if (currentTime - lastMouseMoveTime > inactivityThreshold &&
        lastMousePosition.x === getLastRecordedPosition().x &&
        lastMousePosition.y === getLastRecordedPosition().y) {
        console.log('鼠标不动');
        // 这里可以执行其他操作，比如显示提示信息等
    }
}, 1000); // 每秒检查一次

// 辅助函数，用于获取上一次记录的鼠标位置
function getLastRecordedPosition() {
    return lastMousePosition;
}