2016-03-19 10 views
0

私は、マウスが.postimagepic要素の上を移動する限り、毎秒ajax要求を送信する関数を持っています。マウスが移動しなかった後にajaxリクエストを停止する方法はありますか?

問題:マウスが30秒間移動しなかった場合、毎秒要求の送信を停止するようにajax要求(おそらくsetinterval関数)を設定します。私の試みはすべてmousemoveで失敗しました。 :/あなたはこの問題を解決するための他のアイデアやアプローチをお持ちですか?

jQueryの

var myInterval; 
    $(".postimagepic").hover(function() { 
     var link = $(this).attr("src").split("/").pop().split(".", 1)[0]; 
     myInterval = setInterval(function() { 
      $.ajax({ 
       url: 'time.php', 
       type: 'post', 
       data: { 
        'user':'somerandomname', 
        'topost':link 
       }, 
       success: function() { 

       } 
      }); 
     }, 1000); 
    }, function() { 
     clearInterval(myInterval); 
    }); 

答えて

1
var myInterval; 
var i = 0; 
    $(".postimagepic").hover(function() { 
     var link = $(this).attr("src").split("/").pop().split(".", 1)[0]; 
     i = 0; 
     myInterval = setInterval(function() { 
      $.ajax({ 
       url: 'time.php', 
       type: 'post', 
       data: { 
        'user':'somerandomname', 
        'topost':link 
       }, 
       success: function() { 

       } 
      }); 
      i++; 
      if(i == 30) { 
       clearInterval(myInterval); 
      } 
     }, 1000); 
    }, function() { 
     clearInterval(myInterval); 
    }); 

上記のコードは、わずか30秒が経過したかどうかを確認かどうか、そしてあなたのための間隔をクリアします別の変数iを導入しています。

+1

非常にうまく動作します。助けてくれてありがとう! – Moritz

1

これは、あなたが探しているものかもしれません:https://jsfiddle.net/w5L0tc7j/1/

私はのMouseMoveとmouseleaveイベントを使用していました。これは最善の実装ではないかもしれません。もう1人のタイムアウトの代わりにカウンタを使用するというアイデアを使用することもできます。

var myInterval = false; 
var idleInterval = false; 
var counter = 0; 
$(function(){ 
    $('.hover_over_me').mousemove(function(){ 
    if(!myInterval) { 
     clearHoverEvent(); 
     myInterval = setInterval(function() { 
     $('#console').html(++counter); 
     }, 1000); 
     idleInterval = setInterval(function() { 
     clearHoverEvent(); 
     }, 30000); 
    } 
    }); 

    $('.hover_over_me').mouseleave(function(){ 
    clearHoverEvent(); 
    }); 
}); 

function clearHoverEvent() { 
    if(myInterval) { 
     clearInterval(myInterval); 
    myInterval = false; 
    } 
    if(idleInterval) { 
    clearInterval(idleInterval); 
    idleInterval = false; 
    } 
} 
関連する問題