14

マウスの動きをチェックし、イベントで関数を実行する小さなJavaScriptを探しています。jquery を使用せずにこれを行うことを検討しており、できれば最新のブラウザーと互換性があります。マウスが動いていないことを検出するこの小さなスクリプトがあります。

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

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

スクリプトを読み込んだ後、初めてマウスを動かしたときに do を起動するように編集できることを願っていますか? 何か助けはありますか？ありがとう

4

2 に答える 2

15

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);
于 2012-11-03T09:53:21.173 に答える
2 
(function(){
   var moved = false
   window.onmousemove = function(e){
      if(!moved){
          moved = true;
          // do what you want after mousemove, here
      }
   }
})()
于 2012-11-03T05:08:44.820 に答える