返回上一个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 相关文章推荐
Javascript 各浏览器的 Javascript 效率对比
Jan 23 Javascript
Jquery中增加参数与Json转换代码
Nov 20 Javascript
Jquery getJSON方法详细分析
Dec 26 Javascript
php+js实现倒计时功能
Jun 02 Javascript
jQuery实现动态表单验证时文本框抖动效果完整实例
Aug 21 Javascript
利用Vue.js指令实现全选功能
Sep 08 Javascript
Bootstrap轮播图的使用和理解4
Dec 14 Javascript
vue实现todolist单页面应用
Apr 11 Javascript
基于vue.js的分页插件详解
Nov 27 Javascript
浅谈Vue2.0父子组件间事件派发机制
Jan 08 Javascript
layui动态加载多表头的实例
Sep 05 Javascript
vue中路由跳转不计入history的操作
Sep 21 Javascript
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数据库密码的找回的步骤
2011/01/12 PHP
JS中encodeURIComponent函数用php解码的代码
2012/03/01 PHP
PHP从FLV文件获取视频预览图的方法
2015/03/12 PHP
详解在PHP的Yii框架中使用行为Behaviors的方法
2016/03/18 PHP
window.onload 加载完毕的问题及解决方案(上)
2009/07/09 Javascript
JS中实现replaceAll的方法(实例代码)
2013/11/12 Javascript
fmt:formatDate的输出格式详解
2014/01/09 Javascript
JavaScript获取table中某一列的值的方法
2014/05/06 Javascript
javascript根据时间生成m位随机数最大13位
2014/10/30 Javascript
jQuery 中DOM 操作详解
2015/01/13 Javascript
浅谈Javascript中Object与Function对象
2015/09/26 Javascript
详解JavaScript数组和字符串中去除重复值的方法
2016/03/07 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
最细致的vue.js基础语法 值得收藏!
2016/11/03 Javascript
80%应聘者都不及格的JS面试题
2017/03/21 Javascript
node使用promise替代回调函数
2018/05/07 Javascript
vue.js多页面开发环境搭建过程
2019/04/24 Javascript
了解javascript中的Dom操作
2019/05/27 Javascript
extjs图形绘制之饼图实现方法分析
2020/03/06 Javascript
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
2020/07/27 Javascript
django中账号密码验证登陆功能的实现方法
2019/07/15 Python
PyTorch中model.zero_grad()和optimizer.zero_grad()用法
2020/06/24 Python
加拿大健康、婴儿和美容产品在线购物:Well.ca
2016/11/30 全球购物
竞选团支书演讲稿
2014/04/28 职场文书
幼儿园教研活动总结
2014/04/30 职场文书
家长建议怎么写
2014/05/15 职场文书
建筑施工安全生产责任书
2014/07/22 职场文书
综治工作汇报材料
2014/10/27 职场文书
抗洪救灾感谢信
2015/01/22 职场文书
红十字会救护培训简讯
2015/07/20 职场文书
接收函
2019/04/22 职场文书
JavaScript嵌入百度地图API的最详细方法
2021/04/16 Javascript
浅谈golang package中init方法的多处定义及运行顺序问题
2021/05/06 Golang
比较几种Redis集群方案
2021/06/21 Redis
Apache Pulsar集群搭建部署详细过程
2022/02/12 Servers
HTML+JS实现在线朗读器
2022/02/15 Javascript