您现在的位置: 365建站网 > 365文章 > Javascript/js:history.go()和history.back()的用法和区别

Javascript/js:history.go()和history.back()的用法和区别

文章来源:365jz.com     点击数:858    更新时间:2017-12-27 11:11   参与评论
Javascript:history.go()和history.back()的用法和区别 
简单的说就是:go(-1): 返回上一页,原页面表单中的内容会丢失;back(): 返回上一页,原页表表单中的内容会保留。 

history.go(-1):后退+刷新 
history.back():后退 

之所以注意到这个区别,是因为不同的浏览器的后退行为也是有区别的,而区别就跟Javascript:history.go()和history.back()的区别类似。 

chrome和ff浏览器后退页面,会刷新后退的页面,若有数据请求也会提交数据申请。类似于 
history.go(-1) 

而safari(包括桌面版和ipad版本)的后退按钮则不会刷新页面,也不会提交数据申请。类似于 
Javascript:history.back()。 

<a href="javascript:history.go(-1);"></a>
这种写法比较推荐,但是还有点兼容性问题,部分浏览器需要在后面加上 return false;


javascript中 history.go  back的总结(亲测)
 

测试程序Demo

form.html 表单页面

<!DOCTYPE html> 
<html> 
<head> 
     <meta charset="utf-8"> 
     <title></title> 
</head> 
<body> 
     <form action="action.html"  > 
        <input type="text" name="" value="" placeholder=""> 
        <input type="submit" name="" value="提交"> 
     </form> 
     <script> 
         alert(""); 
     </script> 
</body> 
</html>  


action.html页面

 

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title></title> 
</head> 
<body> 
    <input type="button" name="" value="返回go" onclick="history.go(-1);"> 
    <input type="button" name="" value="返回back" onclick="history.back(-1);"> 
</body> 
</html>

 

我会首先上图,然后总结。。。

form.html 点击提交

action.html

点击go

点击back

go和back都会刷新,因为只有页面刷新script脚本才会重新执行alert,但是表单内容都还在啊,并不是有的人说的不在

区别在于

back(n)  n参数不管是多少,都是返回上一页,比如不会是-2就返回到上上页,也不会是2 就前进2页

go(n)    n就直接决定进入那个页面


如对本文有疑问,请提交到交流论坛,广大热心网友会为你解答!! 点击进入论坛

发表评论 (858人查看0条评论)
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
昵称:
最新评论
2021年01月08日 13:54游客

既然history.go(-1)会刷新页面,为何还会重新提交表单?

2021年01月08日 13:52游客

既然history.go(-1)会刷新页面,为何还会提交表单?

------分隔线----------------------------

快速入口

· 365软件
· 杰创官网
· 建站工具
· 网站大全

其它栏目

· 建站教程
· 365学习

业务咨询

· 技术支持
· 服务时间:9:00-18:00
365建站网二维码

Powered by 365建站网 RSS地图 HTML地图

copyright © 2013-2024 版权所有 鄂ICP备17013400号