这里介绍了JS前进、后台、刷新的各种方法。也解释了很多前进后退函数出问题的原因。
下面是用按钮做前进后退的JS：<input type=button value=刷新 onclick="window.location.reload()"/> <input type=button value=前进 onclick="window.history.go(1)"/> <input type=button value=后退 onclick="window.history.go(-1)"/> <input type=button value=前进 onclick="window.history.forward()"/> <input type=button value=后退 onclick="window.history.back()"/> <input type=button value=后退刷新 onclick="window.history.go(-1);window.location.reload()"/>其中，history.go(-2)，要写为-2，因在按钮事件触发前，已刷新一次页面，所以应是-2
Response.Write("<script language=javascript>history.go(-2);</script>");此处也要写为“-2”。跟直接写脚本的有所不同。
history.back()是会上一页
history.go(i)去指定的某页如果是history.go(0)那就是刷新页面,这两个属于JS代码，相当于IE的前进、后退功能。
具体的用处就要看什么时候需要这个就用上。比如用户注册时的验证是后台验证，不符合要求的时候就可以用这个，可以最大限度保证用户少重复输入数据。
例如：载入框架页面：function onLoadPage(){ if(event.srcElement.tagName=="SPAN"){ oFrame=top.window.middle.frames[2]; oTxt=event.srcElement.innerText; switch(oTxt){ case "前 进": oFrame.history.go(1); case "后 退": oFrame.history.back(); case "刷 新": oFrame.location.reload(); }}}Javascript刷新页面的几种方法：
history.go(0) location.reload() location=location location.assign(location) document.execCommand('Refresh') window.navigate(location) location.replace(location) document.URL=location.href上面的方法都是我经过验证的，没有任何问题的，可以直接使用，特别要注意的是后退的时候history.go(-2)这里的数字一定要正确。
在退到的页面内
/** * 生命周期函数--监听页面显示 */ onShow: function () { this.onLoad(); },
项目中未读消息列表，点击读取再返回后，仍然显示未读。
window.onpageshow = function(event) { if (event.persisted) { window.location.reload() } };onpageshow 事件在用户浏览网页时触发。
onpageshow 事件类似于 onload 事件，onload 事件在页面第一次加载时触发， onpageshow 事件在每次加载页面时触发，即 onload 事件在页面从浏览器缓存中读取时不触发。
为了查看页面是直接从服务器上载入还是从缓存中读取，你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。 如果页面从浏览器的缓存中读取该属性返回 ture，否则返回 false。
转载于:https://www.cnblogs.com/gxp69/p/8807788.html
情境一：
如下所示功能说明：进入页面默认是选中100元的购买1个礼包的按钮，用户可以选择上面提供的购买金额按钮，也可以自定义购买金额，需支付随着输入框或用户选择的支付金额变化而变化的，主要以输入框内容为主，输入框为空时取上面选中的金额，存在情况：本页面默认是选中100元购买1个礼包，需支付金额此时默认为100元，但当用户输入金额后，上面无选中状态且需支付金额为输入框内的输入金额，这是如点击支付按钮去支付后，用户不想支付了或想重新设置金额即又回退到了该页面，此时上面提供的可选按钮中又恢复了默认的100元的选中状态且需支付金额也是默认的100元，但是输入框内确是缓存的用户输入的金额，这种情况与原业务流程不一致，且需支付金额也不对，虽然在点击支付的时候可以处理回来，但是用户不点击支付这种效果是有问题的。（测试过：andriod手机这样，IOS正常)
解决方案：回退刷新
1.HTML头部，禁止缓存：
<meta http-equiv="Expires" CONTENT="0"> <meta http-equiv="Cache-Control" CONTENT="no-cache"> <meta http-equiv="Pragma" CONTENT="no-cache">注：（手机端）此方法行不通，因为有些浏览器会忽略这个头部，测试过。
2.强行刷新界面
if(window.name != "bencalie"){ location.reload(); window.name = "bencalie"; }else{ window.name = ""; }
window.οnlοad=function(){
if(window.name!="hasLoad"){
location.reload();
window.name="hasLoad";
}
else{
window.name="";
}
}
ps:可能有延时，因为页面会先解析其他内容（针对以上情景可以不强制页面刷新，直接在页面加载的时候进行一写代码的处理即可，如上面情况可在页面加载的时候检查输入框有没有内容，若有则直接将上面选中的默认100去掉选中，并将需支付金额改为输入框内的金额）
window.οnlοad=function(){
var user_input = +$("#user_input_money").val();
if(user_input > 0)
{
$(".active").removeClass("active");
$(".need-money").text(user_input);
}
}
3.php处理:
header("Cache-Control:no-store,no-cache,must-revalidate"); header("Cache-Control:post-check=0,pre-check=0",false); header("Pragma:no-cache");
情景2：
保留页面跳转之前的状态：https://www.zhihu.com/question/29403931
页面有很多标题列表，点开对应标题会展开相应的内容，默认是展开第一个，但是若用户点开了除了默认之外的其他的，有点击查看文章详情，则会跳转到我文章详情页，用户浏览网回退希望页面上展开的还是之前查看的那篇
解决：页面回退无刷新history：history.pushState方法、popstate事件以及hashchange
history.state
当前URL下对应的状态信息。如果当前URL不是通过pushState或者replaceState产生的，那么history.state是null。
history.pushState(state, title, url)
将当前URL和history.state加入到history中，并用新的state和URL替换当前。不会造成页面刷新。
state：与要跳转到的URL对应的状态信息。 title：页面的题目,假如没有就穿空字符串就可以。 url：要跳转到的URL地址，不能跨域。history.replaceState
用新的state和URL替换当前。不会造成页面刷新。
state：与要跳转到的URL对应的状态信息。 title：页面的题目,假如没有就穿空字符串就可以。 url：要跳转到的URL地址，不能跨域。window.onpopstate
history.go和history.back（包括用户按浏览器历史前进后退按钮）触发，并且页面无刷的时候（由于使用pushState修改了history）会触发popstate事件，事件发生时浏览器会从history中取出URL和对应的state对象替换当前的URL和history.state。通过event.state也可以获取history.state。
http://www.haorooms.com/post/ajax_historybackprev
https://liushaozhen.github.io/2017/07/03/js%20%E7%9B%91%E5%90%AC%E6%B5%8F%E8%A7%88%E5%99%A8%E5%90%8E%E9%80%80%E4%BA%8B%E4%BB%B6/
小问题
当我们每次点击，都会存一个pushState，当我们列表返回的时候，我们期望的效果是列表的上一次记录。那么我们用：
window.history.replaceState({"html": datahtml, pageTitle: titlehtml, id: id}, "", lurl);每次都对历史进行替换，而不是创建。就可以实现我们想要的效果！
浏览器实现了
onbeforeunload和onunload事件，onbeforeonload事件是在浏览器即将请求下一个页面（请求还未发出）的时候触发，它可以实现阻止onunload的触发。onunload事件则是浏览器已经将下一个页面请求回来，页面即将跳转的时候触发，该事件无法中断。看起来onbeforeunload事件似乎能满足我们的需求，但是，这只是一个假象。
onbeforeunload事件虽然能阻止onunload事件的触发，但是由于它是浏览器内置的事件，其出现的交互方式和UI界面，均由浏览器厂商控制，并未提供给开发者定义浮层内部内容更多交互的接口，甚至文本性质的提示内容也无法设置样式。所以，想要通过onbeforeunload事件提供的浮层实现收集用户离开的原因或让用户给应用打分的功能并不现实。在进入主题之前，我们先来罗列几个小知识点：
history.pushState可以改变地址栏链接地址，但不触发页面刷新（不离开）popstate事件和hashchange事件popstate事件对象可以获得pushState传递进去的state属性，从而得到变化后的链接地址等hashchange事件对象中包含变化前后的链接地址（oldURL和newURL）hashchange事件
