您的位置:首页 > Web前端 > JavaScript

H5 应用程序返回button的js代码设计,设计仿stack

2015-09-15 21:17 429 查看
history.back();

该代码具有天然的缺陷,二手知道,于H5应用,尤其是模仿移动应用程序时,,这是不够。

在放大期js为了实现类似特征,请轻喷。



不多说,上代码:

/**
* Created by piggsoft@163.com on 2015/5/28.
*/
var historyUtils = {
add : function (url) {
var historyArray = historyUtils.getLocal();
if (!historyArray) {
historyArray = [];
}
var currentPage = historyArray.pop();
if (currentPage && currentPage == url) {
//do nothing
} else if (currentPage){
historyArray.push(currentPage); //历史里面没有如今传入的url。在加回去
}
historyArray.push(url);
historyUtils.saveLocal(historyArray);
},
back : function() {
var historyArray = historyUtils.getLocal();
var currentPage = historyArray.pop();//去掉当前页面,pop取最后,相似stack
var history = historyArray.pop();
if (!history) {//没有历史页面
historyUtils.add(currentPage);//将当前页面增加回数组中
return;
}
historyUtils.saveLocal(historyArray);
window.location.href = history;
},
getLocal : function() {
var result = window.sessionStorage.getItem(historyUtils.key);
if (!result) {
return null;
}
return JSON.parse(result);
},
saveLocal : function(data) {
window.sessionStorage.setItem(historyUtils.key, JSON.stringify(data));
},
init : function() {
historyUtils.saveLocal([]);
},
key : "_history_"
}

historyUtils.add(window.location.href);


在须要实现back的地方调用
historyUtils.back();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: