当前位置: 首页 > news >正文

Framework7开发H5App如何禁止回退离开首页

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

 

将代码放到需要禁止回退的页面即可

主要代码

$(function () {
  //防止页面后退
  history.pushState(null, null, document.URL);
     window.addEventListener('popstate', function () {
     history.pushState(null, null, document.URL);
  });
})

使用路由方法

  • mainView.router.back(options) - 这个方法会触发一个反向的动画并回到上一个页面,也就是浏览历史上的回退

完整代码:

var historyLength = 0;
var timestamp=new Date().getTime();
function forbidHistoryBack(e) {
    var now=new Date().getTime();
    window.setTimeout(function () { historyLength=0; },2000);
    if(historyLength>=1 && now-timestamp<2000) {
        history.back();
        if(isWeiXin() && !!WeixinJSBridge) WeixinJSBridge.call('closeWindow');
    } //2秒内连续点击2次则退出myApp
    else {  //2秒内前1次后退按Framework7的访问页面历史
        historyLength++;
        timestamp = now;
        $.toast('再按一次退出');
        if($('.picker-modal:visible').length>0) jglApp.closeModal($('.picker-modal:visible').get($('.picker-modal:visible').length-1)) //逐层关闭 Picker Modal
        else if($('.popup:visible').length>0) jglApp.closeModal($('.popup:visible').get($('.popup:visible').length-1)) //逐层关闭 Popup
        else if($('.panel-left:visible').length>0) jglApp.closePanel(); //关闭最近打开的侧栏
        else mainView.router.back(); //触发一个反向的动画并回到上一个页面
        history.pushState(null, null, document.URL); //禁止回退离开首页
    }
}

//判断是否微信浏览器的函数
function isWeiXin(){
    //window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息,这个属性可以用来判断浏览器类型
    var ua = window.navigator.userAgent.toLowerCase();  //通过正则表达式匹配ua中是否含有MicroMessenger字符串
    if(ua.match(/MicroMessenger/i) == 'micromessenger') return true;
    else return false;
}

$(function () {
    //防止页面后退
    history.pushState(null, null, document.URL);
    window.addEventListener("popstate",forbidHistoryBack, false);
});

 

转载于:https://my.oschina.net/peaksoho/blog/2989396

相关文章:

  • ListT对元素的查找。
  • Nginx惊现漏洞 百万网站面临“拖库”风险
  • 关于CAD的开发思路
  • 七彩视界
  • centos7使用kubeadm安装k8s集群
  • SQL Profile 总结(一)
  • “Material Design”设计规范在 ComponentOne For WinForm 的全新尝试!
  • Hihicoder 题目1 : Trie树(字典树,经典题)
  • Memcached理解笔记1---安装常规错误监控
  • linux extglob模式 和rm反选
  • LOJ2541:「PKUWC2018」猎人杀
  • Redis 二:入门基本篇
  • 2019预测:三大专家视角解读云计算、无服务器等关键趋势
  • mysql学习笔记--第1天
  • Flink-数据流编程模型
  • 分享的文章《人生如棋》
  • 2017-08-04 前端日报
  • ES学习笔记(10)--ES6中的函数和数组补漏
  • happypack两次报错的问题
  • k8s 面向应用开发者的基础命令
  • Spring思维导图,让Spring不再难懂(mvc篇)
  • Vue实战(四)登录/注册页的实现
  • Zepto.js源码学习之二
  • 不用申请服务号就可以开发微信支付/支付宝/QQ钱包支付!附:直接可用的代码+demo...
  • 开年巨制!千人千面回放技术让你“看到”Flutter用户侧问题
  • 腾讯视频格式如何转换成mp4 将下载的qlv文件转换成mp4的方法
  • 微服务框架lagom
  • 线性表及其算法(java实现)
  • 一天一个设计模式之JS实现——适配器模式
  • 在GitHub多个账号上使用不同的SSH的配置方法
  • Android开发者必备:推荐一款助力开发的开源APP
  • Java总结 - String - 这篇请使劲喷我
  • 阿里云服务器购买完整流程
  • 哈罗单车融资几十亿元,蚂蚁金服与春华资本加持 ...
  • 回归生活:清理微信公众号
  • #Z0458. 树的中心2
  • #我与Java虚拟机的故事#连载15:完整阅读的第一本技术书籍
  • $NOIp2018$劝退记
  • (173)FPGA约束:单周期时序分析或默认时序分析
  • (HAL)STM32F103C6T8——软件模拟I2C驱动0.96寸OLED屏幕
  • (编译到47%失败)to be deleted
  • (二开)Flink 修改源码拓展 SQL 语法
  • (附源码)ssm码农论坛 毕业设计 231126
  • (附源码)计算机毕业设计ssm高校《大学语文》课程作业在线管理系统
  • (十)DDRC架构组成、效率Efficiency及功能实现
  • (一)Neo4j下载安装以及初次使用
  • (一)spring cloud微服务分布式云架构 - Spring Cloud简介
  • (转)eclipse内存溢出设置 -Xms212m -Xmx804m -XX:PermSize=250M -XX:MaxPermSize=356m
  • .NET大文件上传知识整理
  • .Net环境下的缓存技术介绍
  • @angular/cli项目构建--Dynamic.Form
  • @Autowired自动装配
  • @property python知乎_Python3基础之:property
  • @Resource和@Autowired的区别
  • @select 怎么写存储过程_你知道select语句和update语句分别是怎么执行的吗?