jQuery：本当にシンプルな自作の無限スクロール

Question

私はそこに複数のプラグインがあることを知っていますが、私は自分のことを自分が望むように動作させる方法を知ります。

最初に、私のページの一番下までスクロールすると、ajaxLoadActivityという機能がトリガーされ、「詳細を表示」ボタンが表示されます。

$(window).scroll(function() { 

      if ($(window).scrollTop() >= ($(document).height() - $(window).height())) 

       if ($('ol.astream > .loadCount:last > li').attr('id') == "noMoreActivities") 
        return false; 

       ajaxLoadActivity('bottom', true); 
       console.log('fired'); 

     }); 

私はこの問題を自分自身で解決しようとすると、おそらく誰もが遭遇するという問題があります。問題は、関数が複数回起動されることです。関数ajaxLoadActivityはすべてのajaxの処理を行い、<ol>に<li>の項目を追加します。この機能は、「詳細を表示」ボタンとともに使用すると完璧に機能します。

しかし、単にページの一番下にスクロールすると、同じ機能をどのように起動することができるのだろうか。しかし、私はそれを一度だけ呼び出す - 物事が読み込まれるまで待ってから、底に再び到達すると再び関数を起動できるようにしたい。

私は上記のサンプルコードに既に例外があります...最後の要素のIDがnoMoreActivitiesの場合、私は関数をもう一度起動する必要はありません。

どのように私は機能を一度だけ発射し、要求が起こるまで待つことができますか？あなたが$.postを使用しているあなたはそれが

var ajax; 

$(window).scroll(function() { 

    if ($(window).scrollTop() >= ($(document).height() - $(window).height())) 

     if ($('ol.astream > .loadCount:last > li').attr('id') == "noMoreActivities") 
      return false; 

     if (ajax) { 

      return false; // don't make another request, let the current one complete, or 
      // ajax.abort(); // stop the current request, let it run again 
     } 

     ajax = ajaxLoadActivity('bottom', true); 
     console.log('fired'); 

}); 

function ajaxLoadActivity(one, two) { 

    return $.post(/* stuff */); 
} 

Answer 1

。 height（） - $（window）.height（））は、呼び出しを1回だけ実行させます。それを試してみてください。

Answer 2

$（ウィンドウ）.scrollTop（）==（$（文書）を実行しているかどうかを確認後、ごajaxLoadActivity機能でそれを返すことができると仮定すると、