页面哈希和后退按钮发出phonegap + Jquery

时间:2012-06-17 06:41:07

标签: javascript jquery jquery-mobile cordova

我是手机编程的新手,希望有人可以帮助我:

cordova 1.7.0,Jquery 1.7.2和JQM 1.1.0。该应用正在Android上进行测试。

我正在尝试为该应用创建一个启动页面。

<body>    
    <div data-role="page" id="page_loading">
        <div data-role="content">
            <h1 >
                <b>welcome</b>
            </h1>
        </div>
    </div>

    <div data-role="page" id="page_1">
    </div>

    <div data-role="page" id="page_2">
    </div>    
</body>

我在$.mobile.changePage($('page_1'), { changeHash: false});函数的末尾添加了onDeviceReady()。当应用程序启动时,它会立即显示加载页面,加载完成后,它会移动到第一页。

在第一页上,当我按第1页的后退按钮时,它将退出应用程序。这就是我想要的。

然后我再次使用mobile.changePage转到第2页。如果我仍然使用changeHash: false,则backbutton将再次退出应用程序。如果我使用changeHash: true,则后退按钮不会返回到page_1,但会转到加载页面。

如果我在从加载到page1的转换中使用changeHash: true,那么第2页上的backbutton将显示第一页,但在第一页上它将显示加载页面而不是退出应用程序。 / p>

我的问题是:如何让backbutton在第2页,第3页等历史记录中重新开始,但在第1页退出应用程序?

我的猜测是我必须以某种方式重建/清除哈希。谁能告诉我怎么样?感谢

3 个答案:

答案 0 :(得分:0)

我遇到了同样的问题并使用了解决方法:

页面布局:

<body>    
    <!-- page_1 before page_loading in source -->
    <div data-role="page" id="page_1">
    </div>
    <!-- page_loading will be shown first -->
    <div data-role="page" id="page_loading">
        <div data-role="content">
            <h1 >
                <b>welcome</b>
            </h1>
        </div>
    </div>
    <div data-role="page" id="page_2">
    </div>    
</body>

jQuery的:

function onBodyLoad()
{   
    //go to page_loading before deviceready without keeping it in browser history
    $.mobile.changePage('#page_loading', {reverse: false, changeHash: false});
    document.addEventListener("deviceready", onDeviceReady, false);
}

function onDeviceReady()
{   
    //your initialization code here...

    //now go to page_1 without keeping it in browser history since the actual first page was #page_1 already       
    $.mobile.changePage('#page_1', {reverse: false, changeHash: false});

    //your code here...
}

这应该符合您的需求,只需尝试一下......

答案 1 :(得分:0)

从jquery-1.7.1升级到jquery-1.7.2时遇到了麻烦,所以我很快就转回去了。 JQM网站表示它目前支持jQuery 1.6.4和1.7.1。您是否可以尝试降级到1.7.1并查看它是否有效?

(使用cordova 1.8.0和JQM-bleeding edge)

答案 2 :(得分:0)

我知道这是一个非常古老的问题,但我刚刚遇到这个问题并且认为我已经添加了我的解决方案:

我刚刚添加了一个&#34; onPageBeforeShow&#34;监听我的启动页面,并使用全局布尔值&#34; splashDisplayed&#34;检测这是否是第一次显示启动画面。如果是,请将布尔值设置为true,否则,退出应用程序。

$(document).on("pagebeforeshow", "#splash", function () {
if(!splashDisplayed){
    splashDisplayed=true;
}else{
    navigator.app.exitApp();
}
});