0

私はjquery ajax関数を持っています:

function posts()
{
 pfunc = $.ajax({
         url: 'backend/posts.php',
         success: function(data) {
            $('#posts').html(data);
            $('#posts').fadeIn(2000);
            setTimeout(posts,2000);
        }
        });
}
posts();

そして、ユーザーがdivの「投稿」にカーソルを合わせたときに機能を停止し、ユーザーがそのdivにカーソルを合わせるのをやめたときに再開したいと考えています。私がそれを行う方法はありますか？

ありがとう

4

5 に答える 5

2

どうぞ ：）

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
function posts()
{
 pfunc = $.ajax({
         url: 'backend/posts.php',
         success: function(data) {
            $('#posts').html(data);
            $('#posts').fadeIn(2000);
            timer = setTimeout(posts,2000);

        }
        });
}
posts();
$(document).ready(function(){
$('#posts').hover(function(){clearTimeout(timer);}, function(){setTimeout(posts,2000);});
});
</script>
<div id = 'posts'></div>

基本的に、タイムアウトをそれぞれクリアおよびリセットする #post div に、mouser-over および mouse-out イベント ハンドラーを追加しました。

于 2012-08-10T04:16:40.263 に答える
0

あなたはおそらく、あなたが探しているものを実行するajax関数を止めたいと思っています。

    var pfunc = $.ajax({
             url: 'backend/posts.php',
             success: function(data) {
                $('#posts').html(data);
                $('#posts').fadeIn(2000);
                setTimeout(posts,2000);
            }
        });

ホバーイベントの詳細

$("idofyourdiv").hover(
  function () {
   pfunc.abort();
  },
  function () {
    pfunc();
  }
);
于 2012-08-10T04:01:55.200 に答える
0

JavaScript はマルチスレッドではないため、コードの実行を停止することはできません。他の回答で述べたように、ajaxリクエストでabortを呼び出すことができますが、それはコードを停止するのではなく、リクエストを中止するだけです。また、ユーザーがホバリングを停止したときに再度リクエストを行うときに、リクエストを中止するのが賢明かどうかさえわかりません。リクエストを通過させ、レスポンスでホバー状態を確認します。ホバー状態が条件と一致しない場合は、応答をバッファリングし、ユーザーがホバーを停止するまで待機してから、実行を再開します。次のようなもの...

var hovering = false;
var onResponse = null;

$('.Posts').mouseover(function() {
    hovering = true;
});

$('.Posts').mouseout(function() {
    hovering = false;
    onResponse && onResponse();
});

function posts() {
 pfunc = $.ajax({
         url: 'backend/posts.php',
         success: function(data) {
                        onResponse = function() {
                            if(hovering) return;
                            $('#posts').html(data);
                            $('#posts').fadeIn(2000);
                            setTimeout(posts, 2000);
                            onResponse = null;
                        };
                        onResponse();
        }
        });
}

posts();
于 2012-08-10T04:27:29.397 に答える
0

まず、基本コードを次のように構成します。

var timer = null;
var request = null;

function posts() {
 request = $.ajax({
   url: 'backend/posts.php',
   success: function(data) {
     $('#posts').html(data).fadeIn(2000);
     timer = setTimeout(posts, 2000);
   }
 });
}

posts();

次に、タイマーをクリアするためclearTimeout()に、オブジェクトを実行しtimerます。timerタイムアウト関数の ID を格納します。これは、クリアしようとすると存在しない可能性があるため、次のように安全にクリアします。

if (timer !== null) {
  clearTimeout(timer);
}

最後に、AJAX リクエストを中止する必要があるため、それも追加するだけです。

if ((timer !== null) && (request !== null)) {
  clearTimeout(timer);
  request.abort();
}
于 2012-08-10T04:09:32.617 に答える
0

これは、div がホバーされているかどうかを確認します。true の場合、ajax 呼び出しはキャンセルされます。

コードをあまり変更しないようにします。

function posts()
{
 pfunc = $.ajax({
         url: 'backend/posts.php',
         beforeSend: function(){
             if($("#posts").is(":hover")){
                return false;
             }
         },
         success: function(data) {
            $('#posts').html(data);
            $('#posts').fadeIn(2000);
            setTimeout(posts,2000);
        }
        });
}
posts();
于 2012-08-10T04:14:11.000 に答える