禁止用户退出网页,就一个添加窗体历史状态方法,代码很简单,但是建议大家不要去使用,会给用户带来不友好的体验,我这里只是学习这种方法,看到自己代码上有也知道在哪里改变这些代码,所以分享一下:

实现原理:

当我们打开一个网页时,没有退回,是因为地址栏里还没有上一页的历史记录;如果你继续浏览下一页了,有了一条历史记录,你又可以退回之前浏览的网页; 哪么在这里怎么网页无法退回去上一页呢?

全部通过js代码实现:

window.history.pushState()        //意思是 给窗体添加一条历史记录 //history历史的意思,pushState() 推动状态 ,方法意思是在历史记录中增加一条新的记录;

window.history.replaceState()     //replaceState() 替换状态,方法意思是将当前的历史记录给替换掉,传说中的夺舍重生!

* 这两方法分别有3个参数:
* state:一个与指定网址相关的状态对象,popstate事件触发时,该对象会传入回调函数。如果不需要这个对象,此处可以填null。
* title:新页面的标题,但是所有浏览器目前都忽略这个值,就像你保存页面要你输入标题,因此这里可以填null。
* url:新的网址,必须与当前页面处在同一个域。浏览器的地址栏将显示这个网址。一般使用#,来存放当前地址
*
* popstate 事件 :每当活动历史记录条目在同一文档的两个历史记录条目之间发生变化时,就会将事件分派到窗口。
* 也就是说窗体加载时不会触发popstate事件,只有当地址栏发生改变时才会触发popstate事件

解释完了

来看看实列:

<script>
  function pushHistory() {
    var state = {
      title: "title",
      url: "#"
    };
  window.history.pushState(state, "title", "#"); //大家都应该知道#就代表当前连接,这里是 给地址栏添加一条当前地址的历史记录
  }
  pushHistory(); //页面第一次加载,先给地址栏赋个历史记录
  //由于上面只能赋值一次,所以需要通过popstate事件触发时,来进行回调这个方法
  window.addEventListener("popstate", function(e) { //给窗体添加一个popstate事件触发时 来回调历史记录方法
    pushHistory();
  })
</script>

--------------------------------------------------------------------------------------------------------------------

到这里就结束咯  ,把上面这段js 直接拷贝到你的页面去,然后你的页面就无法退出了,但是建议大家不要这样做哦,我这里只是为了学习 这个方法怎么用而已,仅此而已~~~~~~~~~

转载于:https://www.cnblogs.com/longxinyv/p/11310398.html

js禁止退出当前页面相关推荐

  1. JS 禁止访问某页面

    有时候需要禁止某些页面不能访问,而跳转到其他的页面.这里提供了一些参考的代码. demo.html <!DOCTYPE html> <html lang="zh-cn&qu ...

  2. 禁止页面复制功能 js禁止复制 禁用页面右键菜单

    <body οncοntextmenu="return false">禁用网页右键菜单,但是仍然可以使用快捷键复制. js代码禁用复制功能: <script  t ...

  3. vue 禁止显示本网页由、、_【VUE/JS】vue和js禁止浏览器页面后退

    1.vue 禁止浏览器后退 需求是:需要某个路由不能通过浏览器返回,同时不影响相互之间的切换 整理一下解决方法 和 使用方法: 1.在路由配置中给这个路由添加meta信息,比如: { path: '/ ...

  4. HTML5页面,用JS 禁止弹出手机键盘

    HTML5页面,用JS 禁止弹出手机键盘 用户点击input的时候: 会默认调出手机软键盘: 场景:文本框获取焦点时,需要禁止手机弹出自带的输入键盘: 解决方案1: 用一个p/div等标签显示内容:然 ...

  5. html离开页面时,js实现用户离开页面前提示是否离开此页面的方法(包括浏

    本文实例讲述了js实现用户离开页面前提示是否离开此页面的方法(包括浏览器按钮事件).分享给大家供大家参考.具体如下: 用户离开页面前,提示是否离开此页面(包括浏览器按钮事件) 如果在退出页面时需要弹出 ...

  6. php离开界面监听,js实现用户离开页面前提示是否离开此页面的方法(包括浏览器按钮事件)...

    本文实例讲述了js实现用户离开页面前提示是否离开此页面的方法(包括浏览器按钮事件).分享给大家供大家参考.具体如下: 用户离开页面前,提示是否离开此页面(包括浏览器按钮事件) window.onbef ...

  7. php编写用户登录页面,js+php实现静态页面实时调用用户登陆状态的方法

    这篇文章主要介绍了js+php实现静态页面实时调用用户登陆状态的方法,采用在静态页面中使用js调用php页面从而实现用户登录状态的实时调用功能,需要的朋友可以参考下 本文实例讲述了js+php实现静态 ...

  8. js禁止退格键(Backspace)

    为了解决按退格键返回历史页面的问题,用js禁止Backspace键是很好的选择. 下面的方法在项目中用到了,很不错的.贴上来分享一下: function banBackSpace(e) {       ...

  9. js监测关闭当前页面、关闭浏览器和取消监测

    <p>非正常退出考试页面:关闭浏览器.关闭页面提示</p> <p>js监测关闭当前页面.关闭浏览器和取消监测</p> <button onclic ...

  10. 使用js在前端web页面调用打印机

    使用js在前端web页面调用打印机 最近参与了一个比较老的项目改造,需要使用到打印机相关的技术. 由于打印机也是比较老旧,所以没有SDK相关的应用,虽然有桌面的插件,但是需要集成到web中来,最终找到 ...

最新文章

  1. python多项分时求和_python实现连续变量最优分箱详解--CART算法
  2. 接口自动化实现图片上传(selenium/RF)
  3. matlab main函数_Python 和MATLAB 制作Gif 图像
  4. 工作185:解决vue+el-element二级联动,选项选择后不显示的问题
  5. 有没有检查c语言编译错误的软件,求大佬解答,为什么这个程序编译软件检查不出错误...
  6. 声明式和命令式编程_命令式与声明式编程
  7. 8086寄存器的配合使用
  8. java编译命令是什么_java编译命令,java的编译命令是什么?
  9. 百度文库需要使用下载券的文档怎么下载
  10. 教育数据开放平台-雄文
  11. 合并排序时间复杂度推导
  12. c语言图形时钟编程,c语言+图形编程——打造浅易的时钟
  13. python-微信公众个性二维码生成-生成自己名片二维码-链接二维码【超酷】
  14. 《SEM长尾搜索营销策略解密》一一2.6 不再被忽视的个体差异
  15. DRAM Failures(漏电流与寄生电容)
  16. python怎么解压rar文件
  17. 3des解密 mysql_转角处拐弯007
  18. 项目管理知识体系指南(四)项目管理范围
  19. 三星Q950T全景声回音壁测试心得
  20. TCP局域网服务器简易搭建(eps-01s)

热门文章

  1. 使用Expression实现数据的任意字段过滤(1)
  2. iphone:使用NSFileManager取得目录下所有文件(遍历所有文件)
  3. Android平台开发职位招聘要求总结
  4. VS2010中使用Fixdays字体的方法
  5. ias日志察看器(.net)
  6. keras-bert学习
  7. 百篇论文分类整理看数据增广最新研究进展
  8. 腾讯、百度、滴滴最新NLP算法面经
  9. 抖音算法暑期实习春招双双发车
  10. 每日算法系列【LeetCode 122】买卖股票的最佳时机 II