欢迎来到361模板(www.ke361.com),原创精品织梦模板提供商。QQ快速注册登录 网站托管 VIP 网站定制

361模板网

当前位置:361模板网 > 技术文档 > 程序代码 > 网页“返回上一页”的几类代码总结分享
这篇文章主要为大家详细介绍了网页“返回上一页”的几类代码总结分享,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴。

看到这个题目估计不少站长都会觉得老生常谈了,返回上一页谁不知道啊,还拿出来讲?这样的老话题能讲出什么“花”来?361模板觉得越是老的网页功能越是需要收集整理好,分享给草根站长和新手站长。另外再增加一下关于返回上一页的扩展新内容,下面我们先来整理一些常用的返回上一页的代码。

网页“返回上一页”的几类代码总结分享

1、通过文字点击的方式实现返回上一页功能

<a href="javascript:history.back(-1)">返回上一页</a>

或:

<a href="#" onClick="javascript:history.back(-1);">返回上一页</a>

2、通过按钮点击的方式实现返回上一页功能

<input type="button" name="Submit" value="返回上一页" onclick="javascript:window.history.back(-1);">

或者

<input type="button" name="Submit" value="返回上一页" onclick="javascript:history.back(-1);">

3、通过图片点击的方式实现返回上一页功能

<img src="图片的路径" onclick="javascript:window.history.back(-1);" title="返回上一页" alt="返回点击图片" />

或者

<img src="图片的路径" onclick="javascript:history.back(-1);" title="返回上一页" alt="返回点击图片" />

4、通过JS方式实现几秒后自动返回上一页功能

<script language="javascript">setTimeout("window.history.go(-1)",3000)</script>

或者

<script language="javascript">setTimeout("history.go(-1)",3000)</script>

或者

<SCRIPT language=javascript>
function go()
{
 window.history.go(-1);
}
setTimeout("go()",3000);
</SCRIPT>

以上的4种方式,是最为常用的返回上一页的实现办法,其中需要做提醒的是(细心的朋友可能也看出来了),这里返回上一页一般会使用到这2个代码

history.back(-1)和history.go(-1),这2个代码都能实现返回上一页的功能,但是到底2者有什么区别呢?

history.back(-1)

直接返回当前页的上一页,数据全部清空消息,是个新页面。

history.go(-1)

返回当前页的上一页,不过表单里的数据全部还在。

例如:

<input type="button" name="back" value="重新填写" onclick="javascript:history.back(-1);"/>

就表示表单信息全部清空,信息全部重新填写。

扩展阅读

PHP返回上一页的多种方法 PHP执行成功后回退前一页方法

PHP网页编程中经常需要在PHP执行后返回点击过来的页面,也就是返回上一页的功能,这里提供几个有效方法:

1、HEADER方法

适用于放在PHP代码的最前面,这个函数执行前,PHP不能输出其他数据

header(location:你的上一页的路径);   //注意这个函数前不能有输出
header(location:.getenv("HTTP_REFERER"));   //返回其调用页面

2、script返回方法

给页面插入JS,利用JS调动用户的浏览器返回

echo"<script>alert('我要回到上一页了!');history.go(-1);</script>";
echo '<script>alert("我要回到上一页了!");'.'parent.location.href="'.$_SERVER["HTTP_REFERER"].'";</script>';
以上就是网页“返回上一页”的几类代码总结分享的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持361模板网。

感谢打赏,我们会为大家提供更多优质资源!

上一篇CSS小课堂:容器内文本自动换行

下一篇CSS小课堂:CSS实线CSS虚线的具体写法和注意点

取消

感谢您的支持,我们会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

Powered by361模板网,分享从这里开始,精彩与您同在