zoukankan      html  css  js  c++  java
  • 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", "#");
       }();
    
    }
    

     

    
    
  • 相关阅读:
    将包含<pre>标签的json转换成js
    JS 获取系统时间
    JS 对url进行编码
    DevExpress.XtraCharts.ChartControl 实例
    VB 窗体继承
    datagrid 属性
    SQLite操作总结
    Struts2 简介及学习方法介绍
    struts2 中使用DMI(动态调用方法)方式配置action
    JSP 里 的 basePath
  • 原文地址:https://www.cnblogs.com/MrZouJian/p/8644744.html
Copyright © 2011-2022 走看看