Android web view“后退”按钮加载以前加载的div

Question

我会尽量解释清楚。我有一个使用 web 视图的 android 应用程序基本上将网页加载为我的应用程序。我的一切都很好，但是后退按钮似乎是个问题。我已经将此页面全部设置在一个 html 页面上，当单击某些按钮时，它将加载到一个 div 中，以给人一种新页面的感觉，而实际上没有一个页面。我基本上希望后退按钮（在 android 平板电脑或智能手机上）加载以前加载的 div，但我不知道从哪里开始。这是内容切换 jquery 的样子 -

功能内容切换器（设置）{ 变量设置 = { contentClass : '.contentToLoad', navigationId : '#sideMenu', servFront : '#clickHomeHome'

   };
     //Hide all of the content except the first one on the nav
    $(settings.contentClass).not(':first').hide();
    $(settings.navigationId).find('li:first').addClass('active');

    //onClick set the active state, 
    //hide the content panels and show the correct one
    $(settings.navigationId).find('a').click(function(e){
        var contentToShow = $(this).attr('href');
        contentToShow = $(contentToShow);
        //dissable normal link behaviour
        e.preventDefault();
        //set the proper active class for active state css
        $(settings.navigationId).find('li').removeClass('active');
        $(this).parent('li').addClass('active');
        //hide the old content and show the new
        $(settings.contentClass).hide();
        contentToShow.show("slow");
     });
}   

内容切换器(); });

注意：我剪掉了一堆，只是为了展示它在基本层面上的工作原理。

有没有人对从哪里开始有任何建议。我只是希望后退按钮功能能够检查存储在某处的已启动的上一个 div 名称并加载它。

谢谢！

Answer 1

您可以尝试使用 History API。网上有很多教程，例如这个不错：

http://diveintohtml5.info/history.html

基本上这就是它的工作原理。当用户单击 div 的链接以显示您将状态推送到历史堆栈时。

 history.pushState({<object with any information about state>}, pageTitle, newUrl);

这会将状态推送到历史堆栈，这意味着当用户在任何现代浏览器（如 webkit）上按下后退按钮时，它将考虑该状态。当采取后退操作时，它将从历史堆栈中弹出状态。您必须以任何您认为合适的方式聆听和处理此操作：

window.addEventListener("popstate", function(event) {
    // event object contains the information from the pushed state
    // do whatever needed to load the previous page here
});

History API 要求您以某种方式构建代码以使其正常运行。为此，我建议使用一些现有的框架来为您处理返回事件，例如骨干网.js。希望这可以帮助。