如何在觸發popstate事件時獲取上一頁的URL？

Question

這裏的pushState和popstate事件的一個簡單的例子：

<button id="example_btn">Click me</button> 

<script> 
$("#example_btn").click(function(){ 
      history.pushState( 
       { 
        'url' : "example.htm" 
       }, null, "example.htm"); 
}); 
$(window).bind('popstate', function (event) { 
    if (event.originalEvent.state) { 
     console.log(event.originalEvent.state.url); 
    } 
}); 
</script> 

當觸發事件popstate，它顯示當前頁面的URL。

我的問題是：

我怎麼能在這種情況下觸發popstate事件時，你得到以前頁面的網址是什麼？


P.S.我試過document.referrer但它沒有顯示任何東西。

Answer 1

請嘗試將previousUrl保留在變量中並聽取它。

<button id="example_btn">Click me</button> 

<script> 
var previousUrl = null; 
$("#example_btn").on('click', function(){ 
      previousUrl = location.href; 
      history.pushState( 
       { 
        'url' : "example.htm" 
       }, null, "example.htm"); 
}); 
window.onpopstate = function (event) { 
    console.log('Previous url was : ', previousUrl); 
}; 
</script> 

Answer 2

帶有PopStateEvent。我用

window.history.pushState({} , {} , url); 

其他方式我不確定。

下面我測試了它的工作。我希望有所幫助。

window.addEventListener('popstate', function(e){ 
    console.log(e.srcElement.location); 
    /* You get other location types( 'http://....' or '/index.html' */ 
    var previusUrl = e.srcElement.location.href; 
    console.log(previusUrl); 
    // with http://............ 
});