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", "#");
   }();

}

 

 
         
         
       


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM