2

私は正常に動作する非常に単純なスクリプトを持っています。ただし、サーバーの過負荷を避けるために、新しい結果の追加を 3 秒間遅らせたいと考えています。そのため、ページの最後に到達すると、読み込み中の画像が 3 秒間表示され、その後のみajax リクエストが行われるはずです。

「遅刻」はどうすればいいの？

スクリプトは次のとおりです。

$(window).scroll(function(){
    if($(window).scrollTop() == $(document).height() - $(window).height()){
         var lastID = $('div.row-details').last().attr("id");

         $('div#loadmoreajaxloader').show();

         $.ajax({url: "/projects.php?lastID=" + lastID,
            success: function(html){
                if(html){
                       $("#maintable").append(html);
                       $('div#loadmoreajaxloader').hide();
                 }else{
                       $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
                   }
              }
           });
      } 
});
4

3 に答える 3

0

に渡された無名関数でAJAX呼び出しをラップします。たとえばsetTimeout()、次のようになります。

setTimeout(function() {
    $.ajax({
        url: "/projects.php?lastID=" + lastID,
        success: function(html) {
            if (html) {
                $("#maintable").append(html);
                $('div#loadmoreajaxloader').hide();
            } else {
                $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
            }
        }
    });
}, 3000);
于 2012-07-09T13:02:48.703 に答える
0

あなたの発言について: 「私はそれを試しました。最初にページの最後にヒットしただけで機能します。その後、すべてが混乱します :( ",

clearTimeout(); を試すことができますか? スクロール条件が 3 秒以内に再び満たされた場合、ajax 呼び出しは行われません。おそらくあなたの混乱の問題を解決します。

var timeoutId;
    $(window).scroll(function(){
        if($(window).scrollTop() == $(document).height() - $(window).height()){
             var lastID = $('div.row-details').last().attr("id");
             clearTimeout(timeoutId);   // no problem if invalid id, there is no exception     
             $('div#loadmoreajaxloader').show();
               timeoutId = setTimeout(function() {
                    $.ajax({
                        url: "/projects.php?lastID=" + lastID,
                        success: function(html) {
                            if (html) {
                                $("#maintable").append(html);
                                $('div#loadmoreajaxloader').hide();
                            } else {
                                $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
                            }
                        }
                    });
                }, 3000);

          } 
    });
于 2012-07-09T14:10:24.933 に答える
0

最初のAJAX 呼び出しの前に 3 秒待つ必要がないソリューションがあります。Underscore のthrottle()機能を確認してください。

于 2012-07-09T14:18:32.690 に答える