Бесконечная прокрутка (путевые точки) с двойным вызовом jQuery Mobile, кнопкой «Назад» и удаленным скриптом

Question 1

Я создаю сайт jQuery Mobile для будущего использования с PhoneGap, поэтому весь мой контент загружается через AJAX, извлекающий данные из удаленных файлов PHP / MySQL.

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

http://www.media-italia.eu/app/index2.html

Щелчок по новости и возврат с помощью кнопки «Назад» восстанавливают исходное состояние (загружены первые 10 элементов). Это нормально, пока все хорошо

А теперь самое сложное: я бы хотел «бесконечную прокрутку» на моей странице, поэтому я использовал путевые точки jQuery , и вот результат:

http://www.media-italia.eu/app/index.html

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

Я пробовал несколько вещей (включая использование .off () до .on ()), но совсем не повезло
На самом деле не знаю, в чем может быть проблема, пожалуйста, не могли бы вы помочь?

Я также подготовил загружаемый сценарий: http://www.media-italia.eu/app/ app.rar

Заранее спасибо!!!

jquery jquery-mobile infinite-scroll duplicate-data jquery-waypoints

4

Ivan 19 Мар 2013 в 22:39

Извините, только что отредактировал их! (загружаемый скрипт работал)

–

Ivan

20 Мар 2013 в 01:50

Похоже, что значение data-next не обновляется при возврате на страницу. Поскольку при отображении главной страницы появляется и срабатывает кнопка more, поэтому она снова показывает последние 10 новостей.

–

Omar

20 Мар 2013 в 02:39

Answer

Решение пришло от автора плагина: мне пришлось уничтожить и воссоздать путевые точки, так что это:

$('#home .content').waypoint(function(direction) {
    if (direction === 'down'){
        $('#next').trigger('click');
    }
}, { offset: 'bottom-in-view' });

Превратитесь в это:

$('#home .content').waypoint('destroy');
$('#home .content').waypoint(function(direction) {
    if (direction === 'down'){
        $('#next').trigger('click');
    }
}, { offset: 'bottom-in-view' });

1

Ivan 23 Мар 2013 в 16:48

Question 2

Решение пришло от автора плагина: мне пришлось уничтожить и воссоздать путевые точки, так что это:

$('#home .content').waypoint(function(direction) {
    if (direction === 'down'){
        $('#next').trigger('click');
    }
}, { offset: 'bottom-in-view' });

Превратитесь в это:

$('#home .content').waypoint('destroy');
$('#home .content').waypoint(function(direction) {
    if (direction === 'down'){
        $('#next').trigger('click');
    }
}, { offset: 'bottom-in-view' });

1

Ivan 23 Мар 2013 в 16:48

Бесконечная прокрутка (путевые точки) с двойным вызовом jQuery Mobile, кнопкой «Назад» и удаленным скриптом

1 ответ

Похожие вопросы

Новые вопросы

jquery