Cordova(ionic)项目实现双击返回键退出应用


Posted in Javascript onSeptember 17, 2019

Android原生项目实现双击返回键退出应用,是十分简单的,添加如下代码即可实现:

//记录按键时间
  private long exitTime;
  @Override
  public boolean onKeyDown(int keyCode, KeyEvent event) {
    if(keyCode == KeyEvent.KEYCODE_BACK){
      exit();
    }
    return super.onKeyDown(keyCode, event);
  }
  public void exit(){
    if ((System.currentTimeMillis()-exitTime)>2000){
      // 点击间隔大于两秒,做出提示
      Toast.makeText(getApplicationContext(), "再按一次退出应用", Toast.LENGTH_SHORT).show();
      exitTime = System.currentTimeMillis();
    }else{
      finish();
      System.exit(0);
    }
  }

然而,在Cordova项目中,在继承CordovaActivity的MainActivity中添加上面的代码并不起作用,原因是返回键已经被Cordava的WebView处理掉了。

解决办法:在app.js的config中添加如下代码:

// 等待加载PhoneGap
document.addEventListener("deviceready", onDeviceReady, false); 
// PhoneGap加载完毕
function onDeviceReady() {
//按钮事件
document.addEventListener("backbutton", eventBackButton, false); //返回键
document.addEventListener("menubutton", eventMenuButton, false); //菜单键
document.addEventListener("searchbutton", eventSearchButton, false); //搜索键
}
 
//返回键
function eventBackButton(){
//confirm("再点击一次退出!");
window.plugins.ToastPlugin.show_short('再点击一次退出!');
document.removeEventListener("backbutton", eventBackButton, false); //注销返回键
  //3秒后重新注册
  var intervalID = window.setInterval(
    function() {
      window.clearInterval(intervalID);
      document.addEventListener("backbutton", eventBackButton, false); //返回键
    },
    3000
  );
}
//菜单键
function eventMenuButton(){
  window.plugins.ToastPlugin.show_short('点击了 菜单 按钮!');
}
//搜索键
function eventSearchButton(){
  window.plugins.ToastPlugin.show_short('点击了 搜索 按钮!');
}

上面的脚本用到了Cordova的Toast插件,插件地址:

cordova plugin add

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
showModalDialog 和 showModelessDialog
Jan 22 Javascript
用js解决数字不能换行问题
Aug 10 Javascript
jquery 操作日期、星期、元素的追加的实现代码
Feb 07 Javascript
侧栏跟随滚动的简单实现代码
Mar 18 Javascript
jQuery使用height()获取高度需要注意的地方
Dec 13 Javascript
jQuery结合CSS制作漂亮的select下拉菜单
May 03 Javascript
JavaScript数据类型转换的注意事项
Jul 31 Javascript
jQuery EasyUI tree增加搜索功能的实现方法
Apr 27 jQuery
js使用html2canvas实现屏幕截取的示例代码
Aug 28 Javascript
Angular2.0实现modal对话框的方法示例
Feb 18 Javascript
vue中keep-alive的用法及问题描述
May 15 Javascript
使用PreloadJS加载图片资源的基础方法详解
Feb 03 Javascript
如何使用proxy实现一个简单完整的MVVM库的示例代码
Sep 17 #Javascript
ionic+html5+API实现双击返回键退出应用
Sep 17 #Javascript
Vue的属性、方法、生命周期实例代码详解
Sep 17 #Javascript
小程序的上传文件接口的注意要点解析
Sep 17 #Javascript
微信小程序实现蒙版弹出窗功能
Sep 17 #Javascript
kafka调试中遇到Connection to node -1 could not be established. Broker may not be available.
Sep 17 #Javascript
ionic2.0双击返回键退出应用
Sep 17 #Javascript
You might like
Yii控制器中filter过滤器用法分析
2016/07/15 PHP
PHP PDOStatement::fetchObject讲解
2019/02/01 PHP
JavaScript 面向对象编程(2) 定义类
2010/05/18 Javascript
修改好的jquery滚动字幕效果实现代码
2011/06/22 Javascript
JavaScript 高级篇之闭包、模拟类,继承(五)
2012/04/07 Javascript
js的延迟执行问题分析
2014/06/23 Javascript
Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式
2014/06/24 Javascript
浅谈javascript实现八大排序
2015/04/27 Javascript
AngularJS基础 ng-keyup 指令简单示例
2016/08/02 Javascript
Vue计算属性的使用
2017/08/04 Javascript
React-Native中禁用Navigator手势返回的示例代码
2017/09/09 Javascript
HTML5开发Kinect体感游戏的实例应用
2017/09/18 Javascript
vue axios同步请求解决方案
2017/09/29 Javascript
JS中通过url动态获取图片大小的方法小结(两种方法)
2018/10/31 Javascript
vue自定义指令的创建和使用方法实例分析
2018/12/04 Javascript
基于Three.js实现360度全景图片
2018/12/30 Javascript
mpvue全局引入sass文件的方法步骤
2019/03/06 Javascript
手把手15分钟搭一个企业级脚手架
2019/09/16 Javascript
详细解读Python中的__init__()方法
2015/05/02 Python
Python使用bs4获取58同城城市分类的方法
2015/07/08 Python
Python中使用装饰器来优化尾递归的示例
2016/06/18 Python
Python2和Python3中print的用法示例总结
2017/10/25 Python
Python实现按照指定要求逆序输出一个数字的方法
2018/04/19 Python
Python中创建二维数组
2018/10/17 Python
Python操作redis实例小结【String、Hash、List、Set等】
2019/05/16 Python
python双向链表原理与实现方法详解
2019/12/03 Python
Python如何使用argparse模块处理命令行参数
2019/12/11 Python
学python需要去培训机构吗
2020/07/01 Python
ebookers英国:隶属全球最大的在线旅游公司Expedia
2017/12/28 全球购物
教师先进事迹材料
2014/12/16 职场文书
灵山大佛导游词
2015/02/04 职场文书
离婚案件上诉状
2015/05/23 职场文书
节约用水广告语60条
2019/11/14 职场文书
python3+PyQt5+Qt Designer实现界面可视化
2021/06/10 Python
Redis基本数据类型List常用操作命令
2022/06/01 Redis
Win10服务全部禁用了怎么启动?Win10服务全部禁用解决方法
2022/09/23 数码科技