且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何清除或更改Jquery Mobile的导航历史记录?

更新时间:2023-09-18 16:44:52

基本上,您需要篡改两个历史记录"pot".浏览器和JQM.

Basically you have two history "pots" you need to tamper with. Browser and JQM.

JQM urlHistory
您可以非常轻松地修改JQM的urlHistory.通过JQM代码:

JQM urlHistory
You can modify JQMs urlHistory very easily. From the JQM code:

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's 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);
    }
};

因此上述所有功能均可用,例如可以这样调用:

So all of the above functions are available and can be called like this for example:

$.mobile.urlHistory.clearForward();

要监视您的历史记录,请将其放在某个地方并监听pageChange(一旦完成转换)以查看urlHistory内部内容:

To monitor your history, put this somewhere and listen for pageChange (once transitions are done) to see what is inside the urlHistory:

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

从那里您可以开始查看历史记录中的内容,并根据需要进行清理.

From there you can start to see what should be in the history and clean it up as you need.

我在自己的导航层上经常使用它来修改urlHistory中存储的内容和不应存储的内容.与浏览器同步是困难的部分...

I'm using this a lot for my own navigation layer to modify what is stored in the urlHistory and what should not be stored. Sync-ing with the browser is the difficult part...

与浏览器同步时:
在我的导航层中,我仅从urlHistory中删除重复的条目,因此,当您单击浏览器的后退按钮时,总会有一个页面要转到(而不是两个)页面.在您的情况下,您可能会在浏览器历史记录中包含4个条目,但是如果您从JQM urlHistory中删除2个条目,则单击后退"按钮将有两页不要去" .因此,如果您的浏览器历史记录如下所示:

On sync-ing with the browser:
In my navigation layer I'm only removing double entries from the urlHistory, so there is always a page to go to (and not two), when you click the browser back button. In your case, you will presumable have 4 entries in the browser history, but if you remove 2 entries from JQM urlHistory, you will have two pages "not to got to" when the back button is clicked. So if your browser history looks like this:

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

然后删除 page2 page3 ,单击后退按钮应显示:

And your remove page2 and page3, clicking back-button should result in:

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]

理论上的解决方法是:

  1. 让柜台保持您进入页面的深度"
  2. 从JQM urlHistory中删除页面并获得跳转"值= counter-removedPages
  3. 在下一个浏览器上单击鼠标左键,跳x window.history(后退),只让一个JQM过渡通过.您的网址将一步一步展开page4> page3> page2> page1,并且只允许JQM从page4到page1进行一次转换
  4. 检查urlHistory中的内容,然后在三次返回"后进行清理

请注意,这不是***解决方案,您必须考虑很多事情(用户单击其他位置然后返回).我一直试图使类似的东西在更复杂的设置中工作,最终只是停止使用它,因为它从未像应有的那样起作用.但是对于更简单的设置,它可能会很好地工作.

Beware this is not an optimal solution and you have to consider a lot of things (user clicks somewhere else before going back etc). I tried forever to get something like this to work in a more complicated setup and eventually just stopped using it, because it never worked as it should. But for a simpler setup it may very well work.