在没有JQuery的情况下检测鼠标移动

Question

我正在寻找一小块javascript来检查鼠标的移动情况,如果它确实执行了一个功能.我希望在没有jquery的情况下做到这一点,并且最好与大多数现代浏览器兼容.我有这个小脚本,可以检测鼠标何时不移动:

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

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

我希望在加载脚本后第一次移动鼠标时可以编辑东西来解决这些问题吗？有帮助吗？谢谢

Answer 1

Amit的解决方案的问题是它删除了任何现有的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);