1

こんにちは、無限スクロール機能に問題があります。すべてのコンテンツが表示された後もスクロールし続けます (奇妙な動作)。すべてのコンテンツが表示されたときに無限スクロールを停止する方法を探しています

ここに私のコードがあります

<script type="text/javascript">
jQuery(document).ready(function ($) {
(function () {
  var page = 1,
    loading = false,
    finish = false;


  function nearBottomOfPage() {
    return $(window).scrollTop() > $(document).height() - $(window).height() - 200;
  }

  function finish() {
    finish = true;

  }
  $(window).scroll(function () {
    if (loading) {
      return;
    }
    if (nearBottomOfPage() && !finish) {
      loading = true;
      $('#loader').show();
      page++;
      $.ajax({
        url: '/office?page=' + page,
        type: 'get',
        dataType: 'script',
        success: function () {
          $('#loader').hide();
          loading = false;
        }
      });
    }
  });
}());

}))

ここに私が試したものがあります

 <script type="text/javascript">
 jQuery(document).load(function($) {
 function scrollfn (event) {
if (loading) {
  return;
}
if (nearBottomOfPage() && !finish) {
  loading = true;
  $('#loader').show();
  page++;
  $.ajax({
    url: '/office?page=' + page,
    type: 'get',
    dataType: 'script',
    success: function () {
      $('#loader').hide();
      loading = false;
      $(window).unbind('scroll',scrollfn);
    }
    });
   }
   }

  $(window).bind('scroll',scrollfn);
 })
 </script>
4

1 に答える 1

1

「終了」関数を呼び出すことはありません。

finish();成功した ajax コールバックを呼び出す

うまくいかない場合は、次の 3 つのことを試してください。

1）存在をチェックする関数が正しくないと思いますnearBottomOfPage()（正しいバージョンについては、こちらの回答を参照してください：Webページのスクロールの終わりを計算する）->ページのすべてのスタイルも無効にしてみてください。負のマージンまたは負のパディングがあると、スクロール検出器の計算が台無しになります。

2）あなたのことを一時的に忘れてください-つまりnearBottomOfPage()、コードをからに変更してみてif (nearBottomOfPage() && !finish)ください-if (!finish)終了呼び出しが機能する場合、上記の＃1で述べたように、間違いなくnearBottomOfPage（）に問題があります

3) 項目 2 の変更を行ってもまだ機能しない場合は、バインドされたコールバックを匿名関数から分離して別の関数に分割し、より詳細に制御できるようにしてください。これにより、後で次のようにそのコールバックのバインドを解除できます。

function scrollfn (event) {
    if (loading) {
      return;
    }
    if (nearBottomOfPage() && !finish) {
      loading = true;
      $('#loader').show();
      page++;
      $.ajax({
        url: '/office?page=' + page,
        type: 'get',
        dataType: 'script',
        success: function () {
          $('#loader').hide();
          loading = false;
          $(window).unbind('scroll',scrollfn);
        }
      });
    }
  }

$(window).bind('scroll',scrollfn);
于 2012-09-09T17:28:38.007 に答える