document.referrer是javascript提供的默认返回并刷新页面的方法;同时用document.referrer可以获取到上一个页面的url;
那么具体如何使用呢?
举个列子:我们在做商城的时候,会有地址列表页;如下图地址列表页,点击添加收货地址进入添加收货地址页面。当新的收货地址添加完毕后,我们要自动返回到这个页面并且刷新改页面数据;那么就可以用document.referrer方法;
当添加完新地址返回到地址列表页后,数据是刷新了。但是如果这时按返回按键,会发现又会返回到添加新地址页面。那么用户体验度是非常不好的。我们要达到的效果应该是点击返回按钮,返回到进入地址列表的那个页面;
解决方法:可以在地址列表页声明变量获取上一个页面的地址:
思路:获取收货地址页面URL上的参数,判断当前列表页是否在添加收货地址页面过来的;然后进行操作;
var url = document.referrer;//获取上一个页面的地址
var reg = RegExp(/address/);//声明一个增则表达,具体需要根据需要判断的URL去创建;
if(reg.test(str)){
//收货地址页面过来的
}else{
//正常顺序进入的;
}
//这时候需要监听微信返回按键
pushHistory();
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
};
//通过监听微信按钮实现正常返回;
if(reg.test(str)){
window.addEventListener("popstate", function(e) { //回调函数中实现需要的功能
window.history.go(-2);//正常回退 //两级 第一级编辑页面 第二级别当前页面
}, false);
}