jquery mobile - 在动态页面上实现历史导航

Question

我在jqm上有一个移动应用程序。

它包含一个页面，当单击链接时，该页面会使用新内容进行动态更新。 Url解析和逻辑发生在$(document).bind( "pagebeforechange")中。我想要做的是自定义历史记录，刷新，转发等。我已经添加了下面的历史记录类和正在发生的事情。我基本上保存了在堆栈中引入新内容的函数，并在返回时调用它，单击刷新。

我在解释问题时遇到问题，所以我要给应用程序添加一个链接，你可以看到当你点击列表视图并尝试点击后退按钮时会发生什么 Mobile App

正如您所看到的，单击后退时，页面上的所有内容都会消失。如何在jqm中实现自定义历史记录？

$(document).bind( "pagebeforechange", function( e, data ) {
    if ( typeof data.toPage === "string" ) { 
        var u = $.mobile.path.parseUrl( data.toPage ),
        re = /^#wallmsg_page/;
        re1 = /^#public_post_page/;
        $.mobile.showPageLoadingMsg();
        var $page = $( '#index_page' );
        if ( u.hash.search(re) !== -1 ) {

            window.nHistory.add(function ()
            {
                var edata=data;
                var eu=u;
                var $epage=$page;
                console.log(data.toPage);
                showPublicPost( eu, edata.options );
                $epage.page();
                edata.options.dataUrl = eu.href;
                edata.options.transition = 'flip';
                $.mobile.changePage( $epage, edata.options );                        
            });
            window.nHistory.getStack()[(window.nHistory.getStack().length-1)]();
            e.preventDefault();
        } else
            if ( u.hash.search(re1) !== -1 ) {
            var edata=data;
            window.nHistory.add(function ()
            {                
                var edata=data;
                var eu=u;
                var $epage=$page;

                showNextPage(eu,edata.options);
                $epage.page();
                edata.options.dataUrl = eu.href;
                edata.options.transition = 'flip';
                $.mobile.changePage( $epage, edata.options );                        
            });
            window.nHistory.getStack()[(window.nHistory.getStack().length-1)]();
            e.preventDefault(); 
        }
        //console.log(window.nHistory.getStack());
    }
});

//implement history
var Stack = function () {
    var stack = [];
    this.add = function (cFunc) {
        stack.push(cFunc);
        return this;
    };
    this.get = function () {
        return stack.pop();
    };
    this.size = function () {
        return stack.length;
    };
    this.isEmpty = function () {
        return (stack.length == 0);
    };
    this.getStack = function () {
        return stack;
    };
};
window.nHistory = new Stack();
var moveBack = function () {
    if (!(window.nHistory.isEmpty())) {
        var c = window.nHistory.get();
        c();
    } else {
        goHome();
    }
}
var refreshPage = function () {
    window.nHistory.getStack()[(window.nHistory.getStack().length-1)]();
}