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 中 null、NaN和undefined的区别总结
Apr 10 Javascript
JavaScript判断前缀、后缀是否是空格的方法
Apr 15 Javascript
招聘网站基于jQuery实现自动刷新简历
May 10 Javascript
js实现华丽的九九乘法表效果
Mar 29 Javascript
jQuery插件FusionCharts绘制的2D双柱状图效果示例【附demo源码】
May 13 jQuery
JS脚本实现网页自动秒杀点击
Jan 11 Javascript
详解vue中组件参数
Jul 09 Javascript
vue devtools的安装与使用教程
Aug 08 Javascript
vue中的双向数据绑定原理与常见操作技巧详解
Mar 16 Javascript
js实现文章目录索引导航(table of content)
May 10 Javascript
浅谈JavaScript中this的指向问题
Jul 28 Javascript
Javascript中的解构赋值语法详解
Apr 02 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
第十四节--命名空间
2006/11/16 PHP
php 魔术方法使用说明
2009/10/20 PHP
PHP自动识别字符集并完成转码详解
2013/08/02 PHP
配置php.ini实现PHP文件上传功能
2014/11/27 PHP
php pdo操作数据库示例
2017/03/10 PHP
Laravel框架搜索分页功能示例
2019/02/01 PHP
创建一个复制UBB软件信息的链接或按钮的js代码
2008/01/06 Javascript
基于NodeJS的前后端分离的思考与实践(二)模版探索
2014/09/26 NodeJs
JavaScript将字符串转换成字符编码列表的方法
2015/03/19 Javascript
nodejs实现bigpipe异步加载页面方案
2016/01/26 NodeJs
jQuery Tags Input Plugin(添加/删除标签插件)详解
2016/06/20 Javascript
xmlplus组件设计系列之树(Tree)(9)
2017/05/02 Javascript
Vue拖拽组件开发实例详解
2018/05/11 Javascript
Webpack中雪碧图插件使用详解
2018/05/25 Javascript
vue中使用element-ui进行表单验证的实例代码
2018/06/22 Javascript
vue 之 css module的使用方法
2018/12/04 Javascript
基于vue+axios+lrz.js微信端图片压缩上传方法
2019/06/25 Javascript
ES6中Symbol、Set和Map用法详解
2019/08/20 Javascript
js实现图片实时时钟
2020/01/15 Javascript
JavaScript实现通讯录功能
2020/12/27 Javascript
[49:42]DOTA2上海特级锦标赛主赛事日 - 3 胜者组第二轮#2Secret VS EG第一局
2016/03/04 DOTA
Python实现合并字典的方法
2015/07/07 Python
详解Python迭代和迭代器
2016/03/28 Python
Python判断文件和字符串编码类型的实例
2017/12/21 Python
Ubuntu16.04安装python3.6.5步骤详解
2020/01/10 Python
Pandas DataFrame求差集的示例代码
2020/12/13 Python
html5 touch事件实现页面上下滑动效果【附代码】
2016/03/10 HTML / CSS
使用canvas绘制超炫时钟
2014/12/17 HTML / CSS
匡威西班牙官网:Converse西班牙
2019/10/01 全球购物
初中生个人学习的自我评价
2013/12/04 职场文书
大学生文员专业个人求职信范文
2014/01/05 职场文书
理财投资建议书
2014/03/12 职场文书
2014年房地产销售工作总结
2014/12/01 职场文书
公司借条范本
2015/05/25 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers
何时使用Map来代替普通的JS对象
2021/04/29 Javascript