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

实现原理:

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

全部通过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 直接拷贝到你的页面去,然后你的页面就无法退出了,但是建议大家不要这样做哦,我这里只是为了学习 这个方法怎么用而已,仅此而已~~~~~~~~~

js禁止退出当前页面的更多相关文章

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

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

  2. js禁止复制页面文字

    做项目的时候有客户提出要求,不能用用户浏览他发表的文章时复制他的文章 一种比较简单的方法,禁止用户选中页面的文字和禁止用户右键菜单 document.oncontextmenu = new Funct ...

  3. js禁止浏览器页面后退功能

    js禁止浏览器页面后退功能: <script> $(function(){ ) { //防止页面后退 history.pushState(null, null, document.URL) ...

  4. 【VUE/JS】vue和js禁止浏览器页面后退

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

  5. js离开或刷新页面检测(且兼容FF,IE,Chrome)

    <!DOCTYPE html> <html> <head> <script> function closeIt() { return confirm(& ...

  6. js中退出语句break,continue和return 比较

    js中退出语句break,continue和return 比较 在 break,continue和return 三个关键字中, break,continue是一起的,return 是函数返回语句,但是 ...

  7. silverlight 退出当前页面、跳转到主页面

    1.退出当前页面 private void imgExit_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) { if (Message ...

  8. js中退出语句break,continue和return 比较(转)

    原链接:http://blog.163.com/ued_er/blog/static/199703159201210283107315/ js中退出语句break,continue和return 比较 ...

  9. js禁止微信浏览器下拉显示黑底查看网址,不影响内部Scroll

    开发项目跑在微信浏览器经常会遇到一个问题,微信浏览器下拉的时候会出现自带的黑色底色(显示网址)如下图: 网上好多js禁止操作的做法禁止了内部Scroll,导致页面不能滚动,上拉加载失效,例如这种做法: ...

随机推荐

  1. Java获取类方法上的注解

    , fullName.indexOf("$$")); try { clz = Class.forName(fullName); } catch (ClassNotFoundExce ...

  2. javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行

    jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...

  3. C# 清除sqlite密码

    C# 清除sqlite密码 .创建空的sqlite数据库. //数据库名的后缀你可以直接指定,甚至没有后缀都可以 //方法一:创建一个空sqlite数据库,用IO的方式 FileStream fs = ...

  4. 一步一步跟我学ImGui.第一讲.配置OpenGl2+ImGui环境

    目录 搭建ImGui例子中的第一个OpenGl2环境 一丶搭建OpenGL2环境 1.下载GLFW库 2.解压GLFW库. 3.将GLFW库拷贝到你的工程文件下. 4.配置到Vs2013中. 5.测试 ...

  5. manjaro (arch) 安装搜狗输入法

    本文通过MetaWeblog自动发布,原文及更新链接:https://extendswind.top/posts/technical/sogou_input_install_in_arch_manja ...

  6. PHP连接MySQL创建表

    源代码: <?php header("Content-Type:text/html;charset=utf8");//声明编码格式 $conn=mysqli_connect( ...

  7. encode(编码)和decode(解码)方法

    JS对文字进行编码涉及3个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent 1 ...

  8. useRef获取DOM元素和保存变量(十)

    useRef在工作中虽然用的不多,但是也不能缺少.它有两个主要的作用: 用useRef获取React JSX中的DOM元素,获取后你就可以控制DOM的任何东西了.但是一般不建议这样来作,React界面 ...

  9. 关于如何取消访问https时的提示:“此网站的安全证书存在问题”的解决方法

    问题描述: 症状1:采用IE浏览器通过https/http协议访问网站时,总是提示:“此网站的安全证书存在问题.” 症状2:采用搜狗浏览器打开网页总是看到网页的图片等元素显示不完整,是一个X的小图片. ...

  10. JVM 字节码的结构

    编译的.class文件,可以用javap进行反编译 javap Test.class javap -c Test.class javap -verbose Test.class 1.创建MyTest1 ...