js方法--超时回调 鼠标无动作一段时间后执行回调

以下是实现方法

class MouseIdleListener {
  constructor(waitTime, callback) {
    this.waitTime = waitTime;
    this.callback = callback;
    this.timer = null;
    this.handleMouseMove = this.handleMouseMove.bind(this);
  }

  handleMouseMove() {
    clearTimeout(this.timer);
    this.timer = setTimeout(() => {
      this.callback();
    }, this.waitTime);
  }

  start() {
    document.addEventListener('mousemove', this.handleMouseMove);
  }

  stop() {
    document.removeEventListener('mousemove', this.handleMouseMove);
    clearTimeout(this.timer);
  }
}

这个类的构造函数接受两个参数：等待时间（单位是毫秒）和回调函数。在构造函数中，我们保存了这两个参数到类的实例中，并且初始化了一个计时器和一个鼠标移动事件的处理函数。

handleMouseMove() 方法会在鼠标移动时被调用，并且清除之前的计时器并重新设置一个新的计时器，用来在鼠标移动之后的指定时间后执行回调函数。

start() 方法会开始监听鼠标移动事件，并且在每次鼠标移动时调用 handleMouseMove() 方法。

stop() 方法会停止监听鼠标移动事件，并且清除计时器。

使用方法：

const mouseIdleListener = new MouseIdleListener(1000, () => {
  console.log('鼠标停止移动超过1秒钟了！');
});

// 开始监听鼠标移动事件
mouseIdleListener.start();

// 停止监听鼠标移动事件
mouseIdleListener.stop();

在上面的代码中，我们首先创建了一个 MouseIdleListener 的实例，并且传入了等待时间和回调函数。然后调用 start() 方法开始监听鼠标移动事件，当鼠标停止移动超过1秒钟后会触发回调函数输出 "鼠标停止移动超过1秒钟了！"。最后调用 stop() 方法停止监听鼠标移动事件。