1

jQuery Mobile アプリケーションでリストのエンドレス スクロールを実装するのに問題があります。私が今使っているコードはこれです：

$(window).on('scrollstop', function () { 
  if ($(window).scrollTop() >= $(document).height() - $(window).height() - 20) {
    if(scrollLoad && currentPage < totalPages)
    {
      $.mobile.showPageLoadingMsg();
      ShowMoreThings();
      scrollLoad = false; //Is set to true on ajax success in ShowMoreThings().
    }
  }
});

ただし、これによって常にリフレッシュがトリガーされるわけではありません。問題は、ユーザーが画面を離すとすぐにイベントがトリガーされ、その後もビューポートが動き続けることです (モバイル デバイスで通常スクロールが機能する方法のため)。イベントは移動中に位置を計算し、底に達していないため更新をトリガーしません。次に、ビューポートがページの下部にあるため、ビューポートが移動しないため、ユーザーがさらに下にスクロールしようとしても、それ以上のスクロール イベントはトリガーされません。それをトリガーするには、少し上にスクロールしてからもう一度下にスクロールする必要があります。

scrollstart も聞いてみましたが、「存在しないスペース」にスクロールしようとしてもトリガーされません。

4

3 に答える 3

1

onscrollイベントを使用して、jquery モバイルでエンドレス スクロールをバインドする方が信頼性が高いと思います。

于 2012-09-24T15:31:04.527 に答える
0

jQuery ウェイポイントhttp://imakewebthings.com/jquery-waypoints/をご覧ください。ウェイポイントを使用して、より多くのデータのフェッチをトリガーできます。

于 2012-09-24T15:59:36.333 に答える
0

そのため、いくつかの実験と他の解決策を試した後、問題に対する単純でかなり明白な解決策があったようです. スクロールのマージンを増やした場合、つまり、質問から 20 ピクセルを 200 に増やした場合、スクロールの速度に関係なく、またはページの下部の 200 ピクセル以内に到達する前に画面を離した場合でも、常にトリガーされます。

イベントがいつトリガーされるのか、なぜそれが機能するのかわかりません。いずれにせよ、現在は機能しており、ユーザーが既存のコンテンツをすべて見る前に新しいコンテンツの読み込みを開始するため、マージンが 20 よりも大きい方がよいでしょう。

于 2012-09-25T06:36:10.760 に答える