码迷,mamicode.com
首页 > Windows程序 > 详细

PhoneGap API 之事件处理_双击返回键退出程序

时间:2015-06-12 20:55:59      阅读:211      评论:0      收藏:0      [点我收藏+]

标签:

 

<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>jQuery  Mobile  Web 应用程序</title>
<link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/>
<script src="../jquery.js" type="text/javascript"></script>

<script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script>
<script src="../cordova.js" type="text/javascript"></script>
<script type="text/javascript">

    //使用jQuery mobile设置提示框的信息
    function showMyAlert(text) {
        $.mobile.loadingMessageTextVisible = true;
        $.mobile.showPageLoadingMsg("a", text, true);
    }
    
    //弹出提示框信息的方法,两秒后隐藏
    function myAlert(text) {
        showMyAlert(text);
        setTimeout(hideLoading, 2000);
    }
    
    //隐藏提示框的方法
    function hideLoading() {
        $.mobile.hidePageLoadingMsg();
    }        
    //退出app
    function exitApp() {
        navigator.app.exitApp();
    }
</script>
<script type="text/javascript">
    $(function(){
        document.addEventListener(deviceready,myDeviceready,false);
    })
    
    function myDeviceready(){
        console.log(设备加载完成);
                
        document.addEventListener(backbutton,myBackbutton,false);    
    }
    
    
    //点击返回按钮的事件
    function myBackbutton(){
        //下面的if判断页面是否是id为indexPage的页面如果是才执行,否则执行else的返回上一页
        if ($.mobile.activePage.is(#indexPage)) {
            myAlert(再点击一次退出!);
            document.removeEventListener("backbutton", myBackbutton, false); // 注销返回键
            document.addEventListener("backbutton", exitApp, false);// 通过监听返回键绑定退出事件
            // 3秒后重新注册
            var intervalID = window.setTimeout(function() {
                window.clearTimeout(intervalID);
                document.removeEventListener("backbutton", exitApp, false); // 注销返退出事件
                document.addEventListener("backbutton", myBackbutton, false); // 返回键
            }, 3000);
        }else{
            navigate.app.backHistory();//相当于浏览器的后退
        }                
    }
    
</script>
</head>
<body>
    <div data-role="page" id="indexPage">
        <div data-role="header">
            <h1>PhoneGap实战</h1>
        </div>
        <div data-role="content">
            <a href="#" data-role="button" id="deviceStatus">设备加载中....</a>
            <a href="#" data-role="button" id="deviceCurrentStatus">应用为前台</a>
            <a href="#" data-role="button" id="deviceConectionStatus">连接加载中....</a>
            <a href="#" data-role="button" id="backButtonTouch">返回按钮被按0次</a>
            <a href="#" data-role="button" id="menuButtonTouch">菜单按钮被按0次</a>
            <a href="#" data-role="button" id="batterystatus">电量获取中...</a>
        </div>
        <div data-role="footer">
            <h4>&nbsp;</h4>
        </div>
    </div>
</body>
</html>

 

PhoneGap API 之事件处理_双击返回键退出程序

标签:

原文地址:http://www.cnblogs.com/LO-ME/p/4572501.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!