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

实现原理:

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

全部通过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. lixuxmint系统定制与配置(4)-应用安装

    小书匠Linux 先简单列一下,其实每个软件都有自己的个性化配置,以后有时间了,逐个记录下来.编程主力环境是Python,编辑器使用Jupyter,这个编辑器是在远程服务器启动,映射端口到本地来编辑. ...

  2. zotero zotfile插件 pdf附件文件夹在多系统下的同步设置

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

  3. 再做一遍floyed

    #include<bits/stdc++.h> #define R register int using namespace std; const int inf=0x3f3f3f3f; ...

  4. 无旋Treap模板

    传送门 Code  #include<bits/stdc++.h> #define ll long long #define max(a,b) ((a)>(b)?(a):(b)) # ...

  5. SpringCloud:Zipkin链路追踪,并将数据写入mysql

    1.zipkin server 1.1.新建Springboot项目,zinkin 1.2.添加依赖 <dependency> <groupId>io.zipkin.java& ...

  6. spaceclaim脚本(线生成面体)

    #新建一个列表,用来保存修剪曲线(PS:修建曲线的意思是开始点和结束点不在一起,圆就不属于修建曲线) #注意和Line,Circle类型等的区别 curves = List[ITrimmedCurve ...

  7. mysql使用replace和on duplicate key update区别

    实际业务使用中,有时候会遇到插入数据库,但是如果某个属性(比如:主键)存在,就做更新.通常有两种方式:1.replace into  2.on duplicate key update 但是在使用过程 ...

  8. HikariCP 连接最快的连接池

    三点原因 1.字节码精简 2.自定义 FastList 代替ArrayList ;避免每次get()调用都要进行range check,避免调用remove()时的从头到尾的扫描: 3.优化代码和拦截 ...

  9. input type color

    <input type="color"> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input ...

  10. 树莓派PWM

    import RPi.GPIO as GPIO import time GPIO.setmode(GPIO.BCM) GPIO.setup(26, GPIO.OUT) p = GPIO.PWM(26, ...