popstate实现history路由拦截,监听页面返回事件
1、当活动历史记录条目更改时,将触发popstate事件。
如果被激活的历史记录条目是通过对history.pushState()的调用创建的,
或者受到对history.replaceState()的调用的影响,popstate事件的state属性包含历史条目的状态对象的副本。 2、需要注意的是调用history.pushState()或history.replaceState()用来在浏览历史中添加或修改记录。不会触发popstate事件;
只有在做出浏览器动作时,才会触发该事件,如用户点击浏览器的回退按钮(或者在Javascript代码中调用history.back())
if (window.history && window.history.pushState) {
window.onpopstate = function(event) {
console.log("location: " + document.location + ", state: " + JSON.stringify(event.state));
//window.history.go(1)
//window.history.back()
};
//window.addEventListener("popstate", function(e) {
// window.location = 'http://www.baidu.com';
//}, false);
!function() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
}();
}
popstate实现history路由拦截,监听页面返回事件的更多相关文章
- vue 路由缓存 路由嵌套 路由守卫 监听物理返回
最近开发vue项目,遇到的一些问题,这里整合一下,看到一些博客已经有写相关知识,然后自己再次记录一下. 这是关于vue路由相关比较常见的问题,以后遇到相关路由的问题,会不断更新这篇博客. 需求1:从填 ...
- Android系统onKeyDown监控/拦截/监听/屏蔽返回键、菜单键和Home键
在Android系统中用来显示界面的组件(Component)为Activity,也就是说只有重写Activity的onKeyDown方法来监控/拦截/屏蔽系统的返回键(back).菜单键(Menu) ...
- nginx history路由模式时,页面返回404重定向index.html
1.路由默认是带#的,有时我们感觉不美观,就使其变为history模式,也就没有#字符 2.# 如果找不到当前页面(404),就返回index.html,重新分配路由 location ^~/prod ...
- js监听页面copy事件添加版权信息
个人博客 地址:http://www.wenhaofan.com/article/20180921103346 1.介绍 当页面需要做版权保护时,比如当用户copy我们网站的文章时,我们会希望在他co ...
- js监听浏览器返回事件
$(function(){ pushHistory(); window.addEventListener("popstate", function(e) { window.loca ...
- uni-app中不使用scroll-view组件,监听页面滑直底部事件
最终达到的目标效果 将要用到 监听页面滚动事件:onPageScroll 获取节点信息uni.createSelectorQuery() 标签布局 <template> <view ...
- webview缓存及跳转时截取url地址、监听页面变化
缓存及一些设定 我在做一些项目时,h5做的项目手机浏览器能使用,但是在搬到webview时候不能用,这个时候通过查阅资料,原来是webview没有设定好,包括缓存.缓存大小及路径等等 mWebview ...
- react 监听页面滚动
html: // 如果使用typescript, 定义dom类型 private dom: HTMLDivElement | null // ReactJS中,对Div监听只需要绑定 onScroll ...
- js监听页面放大缩小
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>d ...
随机推荐
- 51nod 1317 相似字符串对(容斥原理+思维)
题意: 称一对字符串(A,B)是相似的,当且仅当满足以下条件: (1)字符串A和B都恰好包含N个字符: (2)A和B串中的每个字符都是小写字母的前k个字符,即A.B中只可能出现'a','b','c', ...
- 转:pairwise 代码参考
Learning to rank with scikit-learn: the pairwise transform http://fa.bianp.net/blog/2012/learning-to ...
- 【BZOJ5418】【NOI2018】屠龙勇士(数论,exgcd)
[NOI2018]屠龙勇士(数论,exgcd) 题面 洛谷 题解 考场上半个小时就会做了,一个小时就写完了.. 然后发现没过样例,结果大力调发现中间值爆\(longlong\)了,然后就没管了.. 然 ...
- dorado7常用内容
1.dataset添加数据this.get("#dsProduct").getData().insert();或者this.get("#dsProduct"). ...
- UESTC--1732
原题链接:http://acm.uestc.edu.cn/problem.php?pid=1732 分析:dp,n个相同物品放入m个相同的盒子(允许为空)的个数为dp[n][m]=dp[n][m-1] ...
- Cyrus SASL介绍(翻译)
http://blog.sina.com.cn/s/blog_7695e9f40100pnpa.html Cyrus SASL介绍 1. 综述 这篇文档讲述的是系统管理员配置SASL的方法,其中详细的 ...
- HDU 6199 DP
gems gems gems Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)To ...
- CollectionUtils.isEqualCollection的用法
在使用Java的集合时,有些时候会需要比较两个集合是否相等,自己写方法其实也简单,但是既然有了好的实现,就不要自己造轮子了,只要了解这个轮子是什么原理就好了. public static boolea ...
- linux shell学习二
参考:http://www.cnblogs.com/waitig/p/5531463.html Shell注释 Shell中的注释以“#”号开头,所有以“#”号开头的代码都会被解释器所忽略. 比如下面 ...
- OpenCV---Numpy数组的使用以及创建图片
一:对头像的所有像素进行访问,并UI图像进行像素取反 (一)for循环取反 import cv2 as cv import numpy as np def access_pixels(image): ...