博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JS监听手机端浏览器的后退按钮的事件方法
阅读量:5281 次
发布时间:2019-06-14

本文共 1131 字,大约阅读时间需要 3 分钟。

返回、后退、上一页按钮点击监听实现代码:

window.addEventListener("popstate", function(e) {  alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能}, false);

虽然我们监听到了后退事件,但是页面还是会返回上一个页面,所以我们需要使用pushState增加一个本页的url,代表本页,大家都非常清楚是#

function pushHistory() {  var state = {    title: "title",    url: "#"  };  window.history.pushState(state, "title", "#");}

当进入该页面,我们就给这个history压入一个本地的连接。当点击返回、后退及上一页的操作时,就进行监听,在监听代码中实现自己操作。

下面是完整的代码:

$(function(){  pushHistory();    window.addEventListener("popstate", function(e) {    alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能  }, false);  function pushHistory() {    var state = {    title: "title",    url: "#"  };    window.history.pushState(state, "title", "#");  }});

PC端浏览器使用jquery监听:

$(document).ready(function(e) {   var counter = 0;  if (window.history && window.history.pushState) {    $(window).on('popstate', function () {    window.history.pushState('forward', null, '#');    window.history.forward(1);    window.location.href='/PF_ECP/po/kefumishu.shtml';//跳转到个人中心  });}  window.history.pushState('forward', null, '#'); //在IE中必须得有这两行  window.history.forward(1);});

 

转载于:https://www.cnblogs.com/weizhanyu/p/10491421.html

你可能感兴趣的文章
box-flex不均分问题
查看>>
Python--GIL 详解
查看>>
Oracle数据导入Mysql中
查看>>
BZOJ-4424 &&CodeForces-19E Fairy DP+dfs (Link-Cut-Tree可A)
查看>>
MongoDB学习笔记——聚合操作之group,distinct,count
查看>>
大道至简读后感(第四章)
查看>>
IDA IDC Tutorials: Additional Auto-Commenting
查看>>
k8s-存储卷1-十二
查看>>
在Android中Intent的概念及应用(二)——Intent过滤器相关选项
查看>>
数据库备份问题
查看>>
前端面试题(4)iframe有哪些优点?iframe缺点是什么?
查看>>
第十六章 多态性(一)
查看>>
INSERT IGNORE INTO / REPLACE INTO
查看>>
Python数据类型-布尔/数字/字符串/列表/元组/字典/集合
查看>>
MFC中theApp
查看>>
类的无参方法
查看>>
Python 开发:初识Python(记笔记)
查看>>
sqlrelay 的安装配置和应用
查看>>
【刷题】SPOJ 705 SUBST1 - New Distinct Substrings
查看>>
IEEE 754浮点数表示标准
查看>>