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

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

文章来源:365jz.com     点击数:379    更新时间: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就直接决定进入那个页面


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


发表评论 (379人查看0条评论)
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码: 点击我更换图片
最新评论
------分隔线----------------------------