1

人々がアイドル状態でない場合にのみ、useronline データベースのタイムスタンプを更新したい (キーボード マウスがしばらくの間アクティブである - そのために jquery プラグインを使用している) 私にとっての問題は、関数の間隔をクリアできないことです。以下のテスト スクリプトでは、カウントを開始すると停止せず、再びアクティブになった場合でも別のカウンターを開始するため、カウントが 2 倍速くなります。そのタイマーを停止するにはどうすればよいですか? アイドル状態のときにカウンターが開始されたことがないため、カウンターを停止することができません。

実際のスクリプトでは、カウンターは mysql テーブルを更新する php を $.get() します。そのため、間隔を使用しています。または、マウスを動かすたびに取得しますか? それはサーバーをロードします。

http://jsbin.com/uleza5テストするには、マウスを 6 秒間動かさないでください。アイドル テキストが表示されたら、マウスを動かすとカウントが開始されます。非アクティブの場合、6 秒後に再びアイドル状態になります。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><script src="js/jquery_plugin_timer2.js"></script> 
  <script src="https://github.com/paulirish/jquery-idletimer/raw/master/jquery.idle-timer.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>timertest</title>
<script language="javascript">

$(document).ready(function(){
    $('.status').html('active');
});

x = 0;
function count() { 
        x+=1;
        $('.usercount').html(x);
        }

(function() {

    var timeout = 6000;
  var it;
    $(document).bind("idle.idleTimer", function() {
    clearInterval(it);    
        $('.status').html('idle');
    });


    $(document).bind("active.idleTimer", function() {
      var it = setInterval(count, 1000);
     $('.status').html('active');
    });
   $.idleTimer(timeout);

})(jQuery);

</script>
</head>

<body>
<div class="status" style="border:1px dashed black; width:500px; height:50px;"></div>
<div class="usercount"style="border:1px dashed black; width:500px; height:50px;"></div>
</body>
</html>
4

1 に答える 1

1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><script src="js/jquery_plugin_timer2.js"></script> 
  <script src="https://github.com/paulirish/jquery-idletimer/raw/master/jquery.idle-timer.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>timertest</title>
<script language="javascript">
var it;
$(document).ready(function(){
    $('.status').html('active');
});

x = 0;
function count() { 
        x+=1;
        $('.usercount').html(x);
        }

(function() {

    var timeout = 6000;

    $(document).bind("idle.idleTimer", function() {
    clearInterval(it);    
        $('.status').html('idle');
    });


    $(document).bind("active.idleTimer", function() {
      it = setInterval(count, 1000);
     $('.status').html('active');
    });
   $.idleTimer(timeout);

})(jQuery);

</script>
</head>

<body>
<div class="status" style="border:1px dashed black; width:500px; height:50px;"></div>
<div class="usercount"style="border:1px dashed black; width:500px; height:50px;"></div>
</body>
</html>
于 2011-05-25T11:33:55.027 に答える