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事件时，会显示当前页面的网址。

我的问题是：

在这种情况下触发popstate事件时如何获取上一页页面的网址？

我试过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。我用

name.html:
<div class="subArea" id="pvDiv">
    <p id="nameP">Name:
        <input id="userName" class="userInput" type="text" placeholder="Enter Name">
    </p>
</div>

其他方式我不确定。

下面我测试了它的工作情况。我希望有帮助。

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

如何在触发popstate事件时获取上一页的网址？

2 个答案: