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 相关文章推荐
javascript fullscreen全屏实现代码
Apr 09 Javascript
JQuery 学习笔记 选择器之一
Jul 23 Javascript
基于jquery的商品展示放大镜
Aug 07 Javascript
JavaScript将数据转换成整数的方法
Jan 04 Javascript
JQuery获取与设置HTML元素的内容或文本的实现代码
Jun 20 Javascript
了解Javascript的模块化开发
Mar 02 Javascript
JavaScript仿flash遮罩动画效果
Jun 15 Javascript
原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法
Aug 05 Javascript
浅谈Webpack自动化构建实践指南
Dec 18 Javascript
为jquery的ajax请求添加超时timeout时间的操作方法
Sep 04 jQuery
微信小程序实现首页弹出广告
Dec 03 Javascript
帮你提高开发效率的JavaScript20个技巧
Jun 18 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
php设置编码格式的方法
2013/03/05 PHP
PHP递归创建多级目录
2015/11/05 PHP
在 Laravel 中动态隐藏 API 字段的方法
2019/10/25 PHP
基于JQuery的日期联动实现代码
2011/02/24 Javascript
基于JQUERY的多级联动代码
2012/01/24 Javascript
Javascript实现单张图片浏览
2014/12/18 Javascript
js使用心得分享
2015/01/13 Javascript
JavaScript中继承用法实例分析
2015/05/16 Javascript
jsonp跨域请求数据实现手机号码查询实例分析
2015/12/12 Javascript
jQuery数据类型小结(14个)
2016/01/08 Javascript
原生JavaScrpit中异步请求Ajax实现方法
2017/11/03 Javascript
使用Angular CLI进行单元测试和E2E测试的方法
2018/03/24 Javascript
使用Vue构建可重用的分页组件
2018/03/26 Javascript
node.js使用免费的阿里云ip查询获取ip所在地【推荐】
2018/09/03 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
Node.js 多线程完全指南总结
2019/03/27 Javascript
基于three.js实现的3D粒子动效实例代码
2019/04/09 Javascript
关于NodeJS中的循环引用详解
2019/07/23 NodeJs
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
微信小程序自定义模态弹窗组件详解
2019/12/24 Javascript
AJAX XMLHttpRequest对象创建使用详解
2020/08/20 Javascript
Vue中关闭弹窗组件时销毁并隐藏操作
2020/09/01 Javascript
Python 常用 PEP8 编码规范详解
2017/01/22 Python
Python2和Python3中print的用法示例总结
2017/10/25 Python
Python金融数据可视化汇总
2017/11/17 Python
Tensorflow卷积实现原理+手写python代码实现卷积教程
2020/05/22 Python
Python Pandas list列表数据列拆分成多行的方法实现
2020/12/14 Python
Snapfish爱尔兰:在线照片打印和个性化照片礼品
2018/09/17 全球购物
Jack Rogers官网:美国经典的女性鞋靴品牌
2019/09/04 全球购物
世界上最大的乐谱选择:Sheet Music Plus
2020/01/18 全球购物
廉政教育的心得体会
2014/09/01 职场文书
政府个人对照检查材料思想汇报
2014/10/08 职场文书
先进个人申报材料
2014/12/30 职场文书
感恩老师主题班会
2015/08/12 职场文书
提升Nginx性能的一些建议
2021/03/31 Servers
简单介绍Python的第三方库yaml
2021/06/18 Python