3

ページを特定のポイント (#first_column DIV の高さ) までスクロールして、サーバー側から json を取得し、コンテンツを #first_column に追加します。

問題は、#first_column の高さまでスクロールすると、多くの Ajax 呼び出しがほぼ同時に発生することです。私が望むのは、#first_column の高さまでスクロールし、サーバーを呼び出して json データを取得し、コンテンツを #first_column に追加することです。#first_column の高さが変わります。次に、#first_column の高さまでスクロールすると、2 番目の Ajax リクエストが取得されます。

助言がありますか？

<script>
   $(window).scroll(function(){
   column_height = $("#first_column").height();
   screenTop = $(window).scrollTop();
   window_height = $(window).height();

if((screenTop+window_height)>=column_height){
      $.ajax({
            url: "/service/article_json.php",
            type: 'GET',
            async: false,
            cache: false,
            timeout: 30000,
            error: function(){
                return true;
            },
            success: function(data){ 
                $.each($.parseJSON(data), function(key,item) {

                  //Add content to #first_column

                });
            }
        });
  }
});
4

3 に答える 3

6

たとえば、フラグを使用してみてください。

var ajaxInProgress = false;

$(window).scroll(function() {
  if(ajaxInProgress) return;
  ajaxInProgress = true;

  $.ajax({
    // setup here
    success: {
      // ...
      ajaxInProgress = false;
    },
    error: {
      // ...
      ajaxInProgress = false;
    }
  });
});

この例でajaxInProgressは、がwindow.scrollに設定されている場合true、コールバックは単に戻り、操作を実行しません。そうでない場合、フラグはtrueに設定され、呼び出しが実行されsuccess、コールバック時またはerrorコールバック時にフラグがリセットされfalse、別のajax呼び出しが可能になります。 。

于 2012-06-19T14:23:28.477 に答える
3

if ステートメント内で最初に行うこととしてイベントのバインドを解除し、必要に応じて Success メソッドで再バインドできます。

$(window).unbind('scroll');
于 2012-06-19T14:17:24.230 に答える