如何解决Popstate:document.locations.href 给出了错误的网址
我正在开发一个基于 ajax 的小型网站,例如 p1-club.de。所以有一个带有子页面链接的 OnePager。子页面通过ajax作为覆盖打开。我使用 jQuery $.load()
加载内容。 URL 通过 pushState 更新。到目前为止一切顺利。
var $sideContent = $(".side-wrapper-content-wrapper");
dynamicPage();
function dynamicPage(){
$(".ajax-trigger").click(function(e){
e.preventDefault();
var _link = $(this).attr("href");
history.pushState('','',_link)
loadContent(_link);
return false;
});
}
$(".side-wrapper-close-button").click(function(){
CloseSide();
history.replaceState({},'/');
});
function loadContent(href){
$("#side-wrapper").scrollTop(0);
document.title = 'Loading...';
$(".side-wrapper-content-wrapper").load(href + " .side-wrapper-content-wrapper",function(responseTxt,statusTxt,xhr){
if(statusTxt == "success")
OpenSide();
document.title = $(responseTxt).filter("title").text();
dynamicPage();
if(statusTxt == "error")
alert("Fail:" + link + xhr.statusText);
});
return null;
};
$(window).bind('popstate',function(){
var newURL = document.location.href;
if (newURL == 'https://example.com'){
CloseSide();
}
else {
history.pushState({},newURL)
loadContent(newURL);
OpenSide();
}
});
function CloseSide(){
...
};
function OpenSide(){
...
};
当我打开页面并单击子页面链接时,一切正常。即使我单击浏览器中的后退按钮,覆盖图也会消失。当我点击第二个子页面链接时,覆盖层再次出现,内容正确,但是当我点击浏览器中的后退按钮时,没有任何反应,因为 document.location.href
给出了例如example.com/page3
返回,而不是 example.com
。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。