Подтвердить что ты не робот

Как очистить или изменить историю навигации JQuery Mobile?

У меня есть приложение PhoneGap с помощью jQuery Mobile. На определенной странице я не могу позволить пользователю вернуться на последнюю страницу, которую он посетил.

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

(1)index -> (2)listing items -> (3)form submited -> (4)sucess page

Что мне нужно: Я хочу очистить всю историю, когда пользователь находится в page 4, и установить page 1 как бы последний и только посещенный, если пользователь попытается вернуться, Возможно, это не совсем возможно, тогда я бы принял любое предложение.

Я полагаю, что jQuery Mobile хранит историю навигации в каком-то массиве, и я надеюсь, что кто-то может помочь найти это. Спасибо заранее!

EDIT: Я использую который представляет собой одну страницу html, где определенные div работают как страницы, управляемые jQuery Mobile.

4b9b3361

Ответ 1

В принципе, у вас есть два "горшка" с историей, с которыми вам нужно вмешаться. Браузер и JQM.

JQM urlHistory
Вы можете очень легко изменить JQMs urlHistory. Из кода JQM:

urlHistory = {
    // Array of pages that are visited during a single page load.
    // Each has a url and optional transition, title, and pageUrl
    // (which represents the file path, in cases where URL is obscured, such as dialogs)
    stack: [],
    // maintain an index number for the active page in the stack
    activeIndex: 0,
    // get active
    getActive: function () {
        return urlHistory.stack[urlHistory.activeIndex];
    },
    getPrev: function () {
        return urlHistory.stack[urlHistory.activeIndex - 1];
    },
    getNext: function () {
        return urlHistory.stack[urlHistory.activeIndex + 1];
    },
    // addNew is used whenever a new page is added
    addNew: function (url, transition, title, pageUrl, role) {
        // if there forward history, wipe it
        if (urlHistory.getNext()) {
            urlHistory.clearForward();
        }
        urlHistory.stack.push({
            url: url,
            transition: transition,
            title: title,
            pageUrl: pageUrl,
            role: role
        });
        urlHistory.activeIndex = urlHistory.stack.length - 1;
    },
    //wipe urls ahead of active index
    clearForward: function () {
        urlHistory.stack = urlHistory.stack.slice(0, urlHistory.activeIndex + 1);
    }
};

Таким образом, все вышеперечисленные функции доступны и могут быть вызваны, например, следующим образом:

$.mobile.urlHistory.clearForward();

Чтобы отслеживать свою историю, поместите это где-нибудь и выслушайте страницуChange (после завершения переходов), чтобы увидеть, что находится внутри urlHistory:

$(document).on('pagechange', 'div:jqmData(role="page")', function(){
    console.log($.mobile.urlHistory.stack);
});

Оттуда вы можете начать видеть, что должно быть в истории, и очистить его по мере необходимости.

Я использую это для своего собственного слоя навигации, чтобы изменить то, что хранится в urlHistory, и что не следует хранить. Синхронизация с браузером - сложная часть...

При синхронизации с браузером:
В моем навигационном слое я удаляю только двойные записи из urlHistory, поэтому всегда нужно перейти к странице (а не к двум), когда вы нажмете кнопку назад. В вашем случае вы предположительно должны иметь 4 записи в истории браузера, но если вы удалите 2 записи из JQM urlHistory, у вас будет две страницы ", чтобы не попасть в, когда нажата кнопка" Назад ". Поэтому, если ваша история браузера выглядит так:

www.google.com
www.somePage.com
www.YOUR_APP.com = page1
    page2
    page3
    page4

И вы удалите page2 и page3, нажав кнопку "Назад", вы получите:

1st back-click = page4 > page1
2nd back-click = page1 > www.somePage.com [because you removed page3]
3rd back-click = www.somePage.com > www.google.com [because you removed page2]

Теоретическое обходное решение будет:

  • держите счетчик, как "глубоко" вы переходите на страницу
  • удалите страницы из JQM urlHistory и получите значение "jump" = counter-deletedPages
  • на следующем обратном щелчке браузера, выполните прыжок x window.history(назад) и разрешите только один переход JQM. Вы url разворачиваете страницу4 > page3 > page2 > page1 за один шаг, и вы разрешаете JQM делать один переход со страницы4 на страницу1
  • проверьте, что в urlHistory и очистите после вашей "тройной обратной".

Помните, что это не оптимальное решение, и вам нужно учитывать много вещей (пользователь щелкает куда-то еще, прежде чем возвращаться и т.д.). Я пытался навсегда получить что-то подобное, чтобы работать в более сложной настройке и в конечном итоге просто прекратил ее использовать, потому что он никогда не работал так, как должен. Но для более простой настройки это может очень хорошо работать.

Ответ 2

Просто FYI; в JQM 1.4 rc1 нет urlHistory, но вы можете читать из навигационного объекта.

Пример:

$.mobile.navigate.history.stack[0];
// Object {hash: "", url: "http://localhost:61659/"}

$.mobile.navigate.history.stack[1];
// Object {url: "http://localhost:61659/Search/Filter", hash: "#/Search/Filter", title: "Search Result", transition: "pop", pageUrl: "/Search/Filter"…}

и вы можете использовать эту функцию утилиты, чтобы узнать, что происходит:

$(document).on('pagechange',function() {
    console.log("Current:" + $.mobile.navigate.history.getActive().url);
    console.log("Stack: (active index = " + $.mobile.navigate.history.activeIndex + " -previous index: " + $.mobile.navigate.history.previousIndex + " )");
    $.each($.mobile.navigate.history.stack, function (index, val) {
        console.log(index + "-" + val.url);
    });
});

см. также здесь

Устаревшее поведение по умолчанию для удаления строк запроса из хэшей. Начиная с 1,5, следуйте спецификации на хэши и поставьте крючок для обработки пользовательской навигации.

Ответ 3

jQuery Mobile использует историю браузера для навигации по страницам, поэтому предотвращение возврата пользователя в браузере действительно невозможно. Однако, поскольку у вас есть приложение phonegap, вы можете напрямую обращаться с кнопкой "Назад". Этот вопрос должен помочь вам: Переопределение поведения Android Backbutton работает только на первой странице с помощью PhoneGap

Ответ 4

Это простой ответ, и поэтому его следует воспринимать как таковую. Вы можете удалять элементы из urlHistory.stack просто с помощью

delete $.mobile.urlHistory.stack[index_of_your_choosing];

Если вы хотите убедиться, что правильная страница удалена, вы можете сделать что-то вроде этого.

var stack_count = $.mobile.urlHistory.stack.length;

for(x=0; x<stack_count; x++){

  $.mobile.urlHistory.stack[x];

  if(typeof $.mobile.urlHistory.stack[x] !== 'undefined'){

    if($.mobile.urlHistory.stack[x].url != 'http://url-to-exclude.com/'){

       delete $.mobile.urlHistory.stack[x];

    }}
}