返回上一个url并刷新界面的js代码


Posted in Javascript onSeptember 12, 2020

JS 重载页面,本地刷新,返回上一页

<a href="javascript:history.go(-1)" rel="external nofollow" >返回上一页</a>
<a href="javascript:location.reload()" rel="external nofollow" >重载页面,本地刷新</a>
<a href="javascript:history.go(-1);location.reload()" rel="external nofollow" >返回上一页重载页面,本地刷新</a>

history.back();
back();

上面两个方法不行,多次尝试后,用下面的解决了

location.href=document.referrer;

返回前二页并刷新的JS代码应该怎样写。

js 方法

<a href="#" rel="external nofollow" onclick="self.location=document.referrer;">返回</a>

asp自动返回并刷新的方法:

response.Write("<script language=javascript>self.location=document.referrer;</script>")

一般用于向一个页面提交action后返回前一页并刷新!

php做法

echo "<script>alert('退出成功!');location.href='".$_SERVER["HTTP_REFERER"]."';</script>";

设置删除成功后返回前一页,并刷新

if($query)
{
$page="listrenwu.php";
<!---这种方式不会刷新,只会原样返回-->
echo "<script>alert('删除成功');history.go(-1)</script>";
<!--//设置删除成功后返回前一页,并刷新-->-->
echo "<script>alert('删除成功');window.location = "".$page."";</script>";
}

这个算是php教程中最简单的哦,不多说你懂的。

下面是其他网友的补充

使用history.length判断是否有上一页面,如果没有就返回到指定页面

使用history.length判断是否有上一页面,如果没有就返回到指定页面,一般是返回到首页

function goBack(){
  if ((navigator.userAgent.indexOf('MSIE') >= 0) && (navigator.userAgent.indexOf('Opera') < 0)){ // IE
    if(history.length > 0){
      window.history.go( -1 );
    }else{
      window.location.href = "/";
    }
  }else{ //非IE浏览器
    if (navigator.userAgent.indexOf('Firefox') >= 0 ||
      navigator.userAgent.indexOf('Opera') >= 0 ||
      navigator.userAgent.indexOf('Safari') >= 0 ||
      navigator.userAgent.indexOf('Chrome') >= 0 ||
      navigator.userAgent.indexOf('WebKit') >= 0){
 
      if(window.history.length > 1){
        window.history.go( -1 );
      }else{
        window.location.href = "/";
      }
    }else{ //未知的浏览器
      window.history.go( -1 );
    }
  }
}

从这里想到一个用户的特殊需求,那就是在公众号中输入生日后 ,关闭H5,让公众号弹出二维码。当时说不可能,现在看来自己太年轻了。

window.opener=null;
window.close();

接着补充

前言

使用单页面的话 document.referrer 一直为空(.html或者ssr网页则存在值)
History.length 表示用户历史会话页面的数量。当用户从新的标签页或框架载入页面其值为“1”,每访问一个页面该值增加“1”。
因为history.length 的数量只增不减,根本不能拿来做判断。

场景

需要判断用户从微信浏览器通过浏览器打开当前网页,如果是则当用户点击返回按钮时返回到web应用(站点)首页

- 或:是否有前一页
- 通过history.length
- 不准确,如果用户曾经打开过,则会存在更多的history.length
- 如果用户不曾打开过,且直接从微信浏览器再使用系统浏览器打开,则history.length === 1(其中手机浏览器中为1,chrome控制台为2)
- 或:判断用户是否访问过
- 通过cookie或是sessionStorage

- https://oldj.net/blog/2013/08/11/browser-history-sniffing

- 或:判断 history 中是否存在指定url
- 没有找到相关方法
- 或:是否是通过微信浏览器唤醒设备浏览器再打开到当前网页的
- 没有找到相关方法
肯定还有其他方法实现 `当用户点击返回按钮时返回到web应用(站点)首页` 这个功能的,现在脑袋有点晕,如果有的话,也希望能得到分享,非常感谢。
对了,Vuex能否判断呢?实在是没有找到相关方法,或许有。

最后

别忘记监听浏览器的返回事件啦 :

window.addEventListener("popstate", function(e) {
alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能
}, false);

我是如何解决的

当用户在微信中打开web应用(站点)时,则提示用户使用浏览器打开;
再配合Cookie和sessionStorage做缓存了router记录来判断用户点击返回按钮时是否需要直接回到home页;

到此这篇关于返回上一个url并刷新界面的js代码的文章就介绍到这了,更多相关js返回上一个url内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jquery多浏览器捕捉回车事件代码
Jun 22 Javascript
javascript向flash swf文件传递参数值注意细节
Dec 11 Javascript
js显示时间 js显示最后修改时间
Jan 02 Javascript
jquery ajax提交整个表单元素的快捷办法
Mar 27 Javascript
js中split和replace的用法实例
Feb 28 Javascript
js闭包所用的场合以及优缺点分析
Jun 22 Javascript
一个例子轻松学会Vue.js
Jan 02 Javascript
Bootstarp基本模版学习教程
Feb 01 Javascript
canvas实现图像截取功能
Feb 06 Javascript
Canvas实现动态的雪花效果
Feb 13 Javascript
详解JavaScript实现动态的轮播图效果
Apr 29 Javascript
vue中三级导航的菜单权限控制
Mar 31 Vue.js
Vue和React有哪些区别
Sep 12 #Javascript
浅谈vue项目利用Hbuilder打包成APP流程,以及遇到的坑
Sep 12 #Javascript
解决vue项目 build之后资源文件找不到的问题
Sep 12 #Javascript
vue项目打包为APP,静态资源正常显示,但API请求不到数据的操作
Sep 12 #Javascript
vue v-on:click传递动态参数的步骤
Sep 11 #Javascript
vue Cli 环境删除与重装教程 - 版本文档
Sep 11 #Javascript
在vue中使用cookie记住用户上次选择的实例(本次例子中为下拉框)
Sep 11 #Javascript
You might like
PHP 编写大型网站问题集
2010/05/07 PHP
php 缩略图实现函数代码
2011/06/23 PHP
PHP列出MySQL中所有数据库的方法
2015/03/12 PHP
PHP模拟asp中response类实现方法
2015/08/08 PHP
PHP实现统计所有字符在字符串中出现次数的方法
2017/10/17 PHP
yii2.0框架实现上传excel文件后导入到数据库的方法示例
2020/04/13 PHP
php实现记事本案例
2020/10/20 PHP
解决火狐浏览器下JS setTimeout函数不兼容失效不执行的方法
2012/11/14 Javascript
js计算字符串长度包含的中文是utf8格式
2013/10/15 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
nodejs开发微博实例
2015/03/25 NodeJs
js实现类似MSN提示的页面效果代码分享
2015/08/24 Javascript
node.js中debug模块的简单介绍与使用
2017/04/25 Javascript
使用js获取伪元素的content实例
2017/10/24 Javascript
从零开始用electron手撸一个截屏工具的示例代码
2018/10/10 Javascript
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
2018/11/21 Javascript
TypeScript的安装、使用、自动编译的实现
2020/04/10 Javascript
小程序富文本提取图片可放大缩小
2020/05/26 Javascript
原生js实现自定义消息提示框
2020/11/19 Javascript
[56:12]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第一场 6.3
2018/06/04 DOTA
Python 数据结构之堆栈实例代码
2017/01/22 Python
Python3连接SQLServer、Oracle、MySql的方法
2018/06/28 Python
python 对类的成员函数开启线程的方法
2019/01/22 Python
浅谈Pandas Series 和 Numpy array中的相同点
2019/06/28 Python
python 检查数据中是否有缺失值,删除缺失值的方式
2019/12/02 Python
python动态文本进度条的实例代码
2020/01/22 Python
Django多数据库配置及逆向生成model教程
2020/03/28 Python
canvas生成带二维码海报的踩坑记录
2019/09/11 HTML / CSS
香港唯港荟酒店预订:Hotel ICON
2018/03/27 全球购物
室内设计专业学生的自我评价分享
2013/11/27 职场文书
办公室前台岗位职责范本
2013/12/10 职场文书
收银员的岗位职责范本
2014/02/04 职场文书
承德避暑山庄导游词
2015/02/03 职场文书
丧事主持词
2015/07/02 职场文书
地震捐款简报
2015/07/21 职场文书
MySQL如何构建数据表索引
2021/05/13 MySQL