jquery бесконечный свиток "сброс" - PullRequest
13 голосов
/ 29 октября 2011

Я использую плагин jquery для бесконечной прокрутки для веб-сайта (https://github.com/paulirish/infinite-scroll)

Все хорошо, за исключением того, что моя страница является поиском, поэтому ... что происходит:

1) вы переходите на страницу, браузер автоматически находит вас и возвращает список элементов (например, столбики) вокруг вас ... Для того, чтобы избежать нумерации страниц в этом списке, необходима бесконечная прокрутка.Все работает до сих пор ... за исключением того факта, что я мог перефразировать "конец бесконечной страницы", и плагин "отвязывает" себя от свитка.

2) Теперь ....если вы хотите вручную вставить адрес во вводимый текст, вы можете это сделать ... вы пишете свой адрес и нажимаете ввод ... и с помощью ajax ( без обновления страницы ) ...я буду искать lat / lon, найти адрес, изменить навигационную ссылку для бесконечной прокрутки .... и, я чувствую себя глупым, НО я не могу найти способ "реактивировать" или "повторно связать"плагин к событию .... Так что мои "новые результаты поиска" не имеют свежего экземпляра "бесконечной прокрутки" ...

(страница "split" правильно и корректно возвращает страницу json пытающегося изменить ")= NUMBER ")

Вот что происходит в консоли:

["math:", 0, 468]
jquery.infinitescroll.min.js:20["heading into ajax", 
Array[2]
    0 : "/ajax/getCoworkings/?page="
    1 : "&latitude=52.5234051&longitude=13.4113999&distance=12"
    length : 2
    __proto__ : Array[0]
]
jquery.infinitescroll.min.js:20["Using JSON via $.ajax() method"]
jquery.infinitescroll.min.js:20["Error", "end"]
jquery.infinitescroll.min.js:20["Binding", "unbind"]

После" unbind "я не могу связать его снова и поэтому имею бесконечный свиток на моем следующемрезультаты поиска ........

Ответы [ 8 ]

27 голосов
/ 22 июня 2012

infinitescroll сохраняет все свои данные экземпляра на самом элементе через $.data, поэтому удаление этих данных экземпляра - единственный надежный способ полностью сбросить infinitescroll.

Эти две строчки должны помочь полностью уничтожить бесконечное вращение.

$elem.infinitescroll('destroy');
$elem.data('infinitescroll', null);

// теперь бесконечная прокрутка может быть переинициализирована нормально, без каких-либо конфликтов или суеты, лежащей вокруг предыдущего экземпляра.

Обратите внимание, что по состоянию на июнь 2012 г. ни один из предыдущих ответов не работал для меня с последней версией jquery.infinitescroll (v2.0)

5 голосов
/ 29 октября 2011

решаемая.

Я добавил:

if (xhr == 'destroy') {
    $.removeData(this.element[0]);
}

в функции

_error: function infscr_error(xhr) {

в строке 228.

Возможно, это не лучший способ сделать это, но это именно то, что мне было нужно.

И то, что я делаю сейчас, в основном то, что вы предложили:

1

$("#myelement").infinitescroll("destroy");

2

$("#myelement").infinitescroll(WHATEVER_SETTINGS);

... без необходимости изменять значения «pathParse»
но это потому, что я изменяю селекторы (далее / навигация)
раньше, с помощью jQuery.

3 голосов
/ 21 января 2014

После попытки других решений безрезультатно, это сработало для меня:

$(window).unbind('.infscr');

Ссылка 1/4 вниз по документации: http://www.infinite -scroll.com / infinite-scroll-jquery-plugin /

3 голосов
/ 21 марта 2012

Здесь это не упоминается, но (в любом случае (в моей версии Infinite Scroll) вам также нужно установить две переменные для повторного создания InfiniteScroll. Вы также должны повторно связать это. Вот код:

$('#cardContainer').infinitescroll('destroy'); // Destroy

// Undestroy
$('#myContainer').infinitescroll({                      
    state: {                                              
        isDestroyed: false,
        isDone: false                           
}
});

InitInfiniteScroll(); // This is a wrapper for the standard initialization you need

// Re-initialize
$('#myContainer').infinitescroll('bind');
2 голосов
/ 18 мая 2012

Мне пришлось сделать нечто подобное, поскольку мой код обновляет URL назначения в зависимости от действий пользователя, а не просто полагаясь на счетчик.

В итоге я реализовал следующий метод сброса, который затем могу вызвать с помощью $ container ('reset');

reset: function infrscr_reset() {
        this.options.state.isDone = false;
        this.options.state.isDuringAjax = false; // I needed this, others may not
        this._resetmsg();
        this._binding('bind');
    },

Я также реализовал закрытый метод для сброса всплывающего сообщения, так как в противном случае оно продолжало бы давать уведомление «больше страниц».

_resetmsg: function infscr_resetmsg() {
        var opts = this.options;
        opts.loading.msg = $('<div id="infscr-loading"><img alt="Loading..." src="' + opts.loading.img + '" /><div>' + opts.loading.msgText + '</div></div>');
        this._debug('Reset loading message');
    },
1 голос
/ 11 мая 2012

Пункт 3)

if (xhr == 'destroy') {
    $.removeData(this.element[0]);

}

Не сработало.По крайней мере, с последней версией.Кладка жалуется на то, что «не может вызвать методы к кладке до инициализации;попытался вызвать метод reload

$container.css('display','none');
$container.html(htmlOutput).imagesLoaded( function(){
             $container.css('display','block');
             $container.masonry('reload');
});

// I have to do this in order to "reset" the stage
$container.infinitescroll('destroy'); // Destroy

// Undestroy
$container.infinitescroll({                      
   state: {
      isDestroyed: false,
      isDone: false
   }
});

// Init.
$container.infinitescroll({
   navSelector  : '#page-nav',    // selector for the paged navigation 
   nextSelector : '#page-nav a',  // selector for the NEXT link (to page 2)
   itemSelector : '.tile',     // selector for all items you'll retrieve
   loading: {
     finishedMsg: '',
     msgText: '',
     img: url + 'img/ajax-loader.gif'
   }
},
// trigger Masonry as a callback
function( newElements ) {
    // hide new items while they are loading
    var $newElems = $( newElements ).css({ opacity: 0 });
    // ensure that images load before adding to masonry layout
    $newElems.imagesLoaded(function(){
        // show elems now they're ready
        $newElems.animate({ opacity: 1 });
        $container.append($newElems).masonry('appended', $newElems, true); 
    });
 }
);

// Re-initialize
$container.infinitescroll('bind');
1 голос
/ 29 октября 2011

Предполагая, что вы создали бесконечную прокрутку, например:

//This will initiate with default values for example purpose
$("#myelement").infinitescroll();

Не могли бы вы просто полностью уничтожить экземпляр:

$("#myelement").infinitescroll("destroy");
//Reset anything else that may cause the page to blow up here
//And then create a new instance with different path variables:
//Note, obviously you'll be initializing it with custom selectors/settings etc so include those as well
$("#myelement").infinitescroll({pathParse:["/ajax/getCoworkings/?page=","&latitude=52.5234051&longitude=13.4113999&distance=12"]});

По существу, если вы не определили pathParse, скрипт попытаетсяработать сам.Если вы делаете, то он использует то, что вы предоставляете.Это не очень изящно, скорее взлом, чем что-либо, но изменение pathParse в данный момент не поддерживается строго бесконечной прокруткой.

0 голосов
/ 13 января 2014

Вы можете сделать это, просто добавив следующий код в объявление бесконечной прокрутки.

errorCallback : function() {
    isc.getContainer().infinitescroll('destroy');
    $.removeData(this);
},

Обратите внимание, что не в файле infinitescroll.js, он должен быть в вашей пользовательской декларации бесконечной прокрутки.

...