6

私のホームページには、無限スクロールを使用する投稿のループがあります。ユーザーは、ajax 検索などの ajax を使用して、そのループを他のループに置き換えることができます。私の問題は、無限スクロールが最初に使用されたときにのみ機能するため、メインループでトリガーされた場合、新しいループがメインを置き換えたときに再び機能しないことです。古いループが新しいループに置き換わるたびに、次の関数がリロードされます。では、無限スクロールをリセットして、新しいループが呼び出されるたびに機能させるにはどうすればよいでしょうか?

var href = 'first';
$(document).ready(function() {
    $('#boxes').infinitescroll({
        navSelector: '.infinitescroll',
        nextSelector: '.infinitescroll a',
        itemSelector: '#boxes .box',
        loadingImg: '<?php echo get_bloginfo('stylesheet_directory') ?>/images/loading.gif',
        loadingText: 'Loading...',
        donetext: 'No more pages to load.',
        debug: false
    }, function(arrayOfNewElems) {
        $('#boxes').masonry('appended', $(arrayOfNewElems));
        if(href != $('.infinitescroll a').attr('href')) {
            href = $('.infinitescroll a').attr('href');
        }
    });
});

wordpress サイトでPual Irish 無限スクロール プラグインの最新バージョン 2.0b2.120519 を使用しています。

4

4 に答える 4

3

使用しているプラ​​グインのバージョンは 100% わかりませんが、最新のディストリビューションにチェックインしました。これを機能させるには 2 つの方法を実行する必要があります。

まず、ajax 関数でdestroy the session on success.

$.ajax({
  url: 'path/to/something.ext',
  success: function(data){
    //call the method to destroy the current infinitescroll session.
    $('#boxes').infinitescroll('destroy');

    //insert the new data into the container from the_loop() call
    $('#boxes').html(data);

    //reinstantiate the container
    $('#boxes').infinitescroll({                      
      state: {                                              
        isDestroyed: false,
        isDone: false                           
      }
    });

    //call the methods you need on the container again.
    $('#boxes').infinitescroll({
      navSelector: '.infinitescroll',
      nextSelector: '.infinitescroll a',
      itemSelector: '#boxes .box',
      loadingImg: '<?php echo get_bloginfo('stylesheet_directory') ?>/images/loading.gif',
      loadingText: 'Loading...',
      donetext: 'No more pages to load.',
      debug: false
    }, function(arrayOfNewElems) {
      $('#boxes').masonry('appended', $(arrayOfNewElems));
      if(href != $('.infinitescroll a').attr('href')) {
        href = $('.infinitescroll a').attr('href');
      }
    });
  }
});

多くのコードを繰り返す代わりに、関数にしてバインドし、バインド解除/再バインドすることもできますが、概説したコードはコピー+貼り付けソリューションである必要があります。

于 2012-06-30T04:12:01.773 に答える
1

私はこれができると思います。私のページでは、別の要素をクリックして別のページをロードします。これらのページも無限スクロールです。だから私は以下のソースを変更します：

       // creation 
        case 'object':

            this.each(function () {

                var instance = $.data(this, 'infinitescroll');

            /*   if (instance) {

                    // update options of current instance
                    instance.update(options);

                } else {
             */
                $(this).removeData("infinitescroll");

                // initialize new instance
                 $.data(this, 'infinitescroll', new $.infinitescroll(options, callback, this));

         //    }

            });

日付を削除して新しい無限スクロールを作成するたびに。だから毎回そしてすべての要素が良いです。

于 2013-03-13T03:41:14.210 に答える
0

電話

$('#boxes').infinitescroll({                      
                state: {                                              
                  isDuringAjax: false,
                    isInvalidPage: false,
            isDestroyed: false,
            isDone: false, // For when it goes all the way through the archive.
            isPaused: false,
            currPage: 1

                }
            });
then 
$('#boxes').infinitescroll({
      navSelector: '.infinitescroll',
      nextSelector: '.infinitescroll a',
      itemSelector: '#boxes .box',
      loadingImg: '<?php echo get_bloginfo('stylesheet_directory') ?>/images/loading.gif',
      loadingText: 'Loading...',
      donetext: 'No more pages to load.',
      debug: false
    }, function(arrayOfNewElems) {
      $('#boxes').masonry('appended', $(arrayOfNewElems));
      if(href != $('.infinitescroll a').attr('href')) {
        href = $('.infinitescroll a').attr('href');
      }
    });

それがうまくいくことを願っています

于 2013-06-03T12:19:20.630 に答える