0

以下のコードに ajax ローダーを追加しました。問題は、データベースからのデータが終了したときに、スクロール機能が無限ループになり、ajax スクロール画像が表示されることです。データが完成したらスクロール機能を停止し、ajax loader の画像も無効にしたいです。これは私のコードです

var counter=25;
$(window).on('scroll',function(){
  if($(window).scrollTop()==($(document).height()-$(window).height())){
$('div#lastPostsLoader').html('<img src="loading-icon.gif">');
     //Get older posts
    $.ajax({
        type: 'POST',
        url: 'getdata.php?start_row=' + counter,
        success: function(oldposts){
        if(oldposts)
        {
            //Append #postsDiv
            $('#data').append(oldposts);
            counter += 15;
        }
           else
        {

            $('#lastPostsLoader').hide();
        }
        }
    });
  } 
});
4

3 に答える 3

1

これを試してください：

var counter = 25;
$(window).on('scroll', function () {
  if ($(window).scrollTop() == ($(document).height() - $(window).height())) {
     $(document).ajaxStart(function() {
        $('div#lastPostsLoader').html('<img src="loading-icon.gif">'); 
     });
    $.ajax({
      type: 'POST',
      url: 'getdata.php?start_row=' + counter,
      success: function (oldposts) {
        if ($('#data')) {
          $('#data').append(oldposts);
          counter += 15;
        }
      }
    });
    $(document).ajaxComplete(function() {
       $('div#lastPostsLoader').find('img[src^="loading"]').remove();
    });
  }
});
于 2013-01-15T05:18:01.610 に答える
0

@パヴァン

if ($('#data')) {
//if you have data process your business logic.
}
else
{
 //Hide the loader.
 //remove the event handler you can use .off for it.
}

イベントハンドラの削除についてhttp://api.jquery.com/off/

于 2013-01-15T06:03:56.043 に答える
0

私が間違っていなければ、成功関数で、データを取得した場合、ローダー自体を非表示にする必要があります。$('#lastPostsLoader') をelse部分に隠す目的は何ですか???

私が理解していることは、データを取得しない場合、ローダーを隠しているということです。

于 2013-01-15T05:54:49.323 に答える