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 ...
随机推荐
- debug - taotao项目 - IDEA拖动文件的自动重命名是超级巨坑, 一定要非常小心
大量的如下错误: org.springframework.beans.factory.BeanCreationException: Could not autowire field 还是要相信报错 不 ...
- 【BZOJ】2956:模积和
Time Limit: 10 Sec Memory Limit: 128 MB Description 求∑∑((n mod i)*(m mod j))其中1<=i<=n,1<=j ...
- php 修改图片分辨率
<?php function resize_image($file, $w, $h, $crop=FALSE) { list($width, $height) = getimagesize($f ...
- valgrind检查C/C++内存泄漏
valgrind --tool=memcheck --leak-check=full ./httptest valgrind --tool=memcheck --leak-check=full -- ...
- python---Scrapy模块的使用(二)
出处:http://www.cnblogs.com/wupeiqi/ 一:去除重复URL scrapy默认使用 scrapy.dupefilter.RFPDupeFilter 进行去重,相关配置有: ...
- GridControl详解(六)样式设置
表格样式:全局设置 例子: 例子: 列样式:只作用于当前的列 通用样式:外观设定 注意:样式设定都是相同的,Appearance前缀.
- phpcms模板
cms的样式有很多种,我们学习的是phpcms,这些cms都是大同小异,学会了一种就可以使用其它的cms. PHPCMS是一款网站管理软件.该软件采用模块化开发,支持多种分类方式,使用它可方便实现个性 ...
- 从python入门ruby
1.Ruby的函数可以不使用括号 def h(name) puts "hello #{name}" end h "jack" 2.python可以直接访问实例的 ...
- filezilla显示隐藏文件
我们在习惯使用flashfxp等工具,但是随着主机商限制较多,这些老的FTP工具不怎么好用了,比如主机商会推荐使用到Filezilla等工具.但是比如息壤主机,我们在管理linux环境下htacess ...
- html5优分期大学生分期购物商城模板
链接:http://pan.baidu.com/s/1dEUAzBz 密码:j150