JQuery Mobile 1.4.5 - don't navigate 'back' to a Dialog page

断了今生、忘了曾经 提交于 2019-12-14 02:34:41

问题


Prior to JQM 1.4, I created dialogues using data-role="dialog" and those pages were not added to the back stack, so navigating off one and then pressing back would bring you to the page before the dialog.

Now with 1.4.5, dialogues are defined as data-role="page" with data-dialog="true". Using this method, the dialog is added to the back stack, so if I navigate off the dialog and then tap back I am returned to the dialog. This is not the behavior I want. Is there a way, when the dialog opens, to tell JQM NOT to add it to the back stack?


回答1:


Updated

As of jQuery Mobile 1.4, dialog widget is deprecated and will be removed in 1.5. It is now converted into a page - as you've mentioned - with data-dialog="true".

When you navigate to a dialog, jQM updates framework's navigation history as well as browser's navigation history. Even if you navigate to a dialog programmatically with changeHash disabled, when you hit back button, you will redirected to second previous history record.

A work around is to listen to pagecontainerbeforechange and alter toPage to navigate to the page where the dialog was called.

$(document).on("pagecontainerbeforechange", function (e, data) {
    if (typeof data.toPage == "string" && data.options.direction == "back") {
        var active = $.mobile.navigate.history.activeIndex;
        for (var i = active; i >= 0; i--) {
            if (!$($.mobile.navigate.history.stack[i].hash).hasClass("ui-dialog") && !$($.mobile.navigate.history.stack[i].hash).hasClass("ui-page-active")) {
                data.toPage = $.mobile.navigate.history.stack[i].url;
                data.options.transition = "flip";
                break;
            }
        }
    }
});

When you want to alter toPage, it should be a string and not an object. The event fires twice on each navigation, it returns string first and then an object.

When it returns a string, check navigation direction options.direction. If the direction is back, loop through $.mobile.navigate.history.stack in reversed order. The previous record should not be a dialog ui-dialog nor the active page ui-page-active. If both conditions return true, alter toPage.

Demo



来源:https://stackoverflow.com/questions/27367056/jquery-mobile-1-4-5-dont-navigate-back-to-a-dialog-page

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!