不使用JQuery检测鼠标移动

Question

我正在寻找一小段javascript代码，它可以检测鼠标移动，并在发生移动时执行一个函数。我希望能够在不使用jquery的情况下实现，并且最好兼容大多数现代浏览器。我有这样一个小脚本，它可以检测鼠标是否没有移动：

<script>
document.onmousemove = (function() {
  var onmousestop = function() {
    /* do stuff */
  }, thread;

  return function() {
    clearTimeout(thread);
    thread = setTimeout(onmousestop, 500);
  };
})();
</script>

我希望能够编辑内容，使得当鼠标在加载脚本后第一次移动时执行do stuff功能。有什么帮助吗？谢谢。

- mark cassaday

Answer 1

Amit's solution存在的问题是它会移除任何现有的mousemove监听器。而且，当鼠标首次移动时，它不会进行清理，从而创建不必要的开销。

以下是更加简洁的解决方案：

var myListener = function () {
    document.removeEventListener('mousemove', myListener, false);
    // do stuff
};

document.addEventListener('mousemove', myListener, false);

看它的实际效果：http://jsfiddle.net/JQBmA/

如果需要支持旧版IE浏览器，可以使用以下代码：

var addListener, removeListener;
if (document.addEventListener) {
    addListener = function (el, evt, f) { return el.addEventListener(evt, f, false); };
    removeListener = function (el, evt, f) { return el.removeEventListener(evt, f, false); };
} else {
    addListener = function (el, evt, f) { return el.attachEvent('on' + evt, f); };
    removeListener = function (el, evt, f) { return el.detachEvent('on' + evt, f); };
}

var myListener = function () {
    removeListener(document, 'mousemove', myListener);
    // do stuff
};

addListener(document, 'mousemove', myListener);

- user123444555621

---

如果您需要支持旧版IE浏览器... - 我真希望不是这样的情况 :( 我非常讨厌IE。 - Kyle

你知道这里需要哪个版本的IE吗？ - rogerdpack

这是jQuery，而不是用户所要求的解决方案。 - danny

Answer 2

(function(){
   var moved = false
   window.onmousemove = function(e){
      if(!moved){
          moved = true;
          // do what you want after mousemove, here
      }
   }
})()

- Amit

---

谢谢，非常好用。在使用IE时要注意一件事，当将onmousemove应用于window对象时无效，所以请改用document.onmousemove！ - mark cassaday

这种方式不好，因为你会破坏其他的“mousemove”事件处理程序。 最好是附加一个事件处理程序。 - vyakhir