返回上一个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 window.setTimeout() 的详细用法
Nov 04 Javascript
JQuery,Extjs,YUI,Prototype,Dojo 等JS框架的区别和应用场景简述
Apr 15 Javascript
zeroclipboard复制到剪切板的flash
Aug 04 Javascript
读jQuery之九 一些瑕疵说明
Jun 21 Javascript
简单实用的全选反选按钮例子
Oct 18 Javascript
jquery获取当前点击对象的value方法
Feb 28 Javascript
js使用html()或text()方法获取设置p标签的显示的值
Aug 01 Javascript
AngularJS的Filter的示例详解
Mar 07 Javascript
详解打造 Vue.js 可复用组件
Mar 24 Javascript
vue使用drag与drop实现拖拽的示例代码
Sep 07 Javascript
Vuex中mutations与actions的区别详解
Mar 01 Javascript
JavaScript生成指定范围随机数和随机序列的方法
May 05 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中实现汉字转区位码应用源码实例解析
2010/06/14 PHP
extjs 学习笔记 四 带分页的grid
2009/10/20 Javascript
查看图片(前进后退)功能实现js代码
2013/04/24 Javascript
优化Jquery,提升网页加载速度
2013/11/14 Javascript
深入理解javascript的执行顺序
2014/04/04 Javascript
javascript学习笔记(八)正则表达式
2014/10/08 Javascript
node.js中的console.trace方法使用说明
2014/12/09 Javascript
信息页文内画中画广告js实现代码(文中加载广告方式)
2016/01/03 Javascript
Node.js中Request模块处理HTTP协议请求的基本使用教程
2016/03/31 Javascript
BootStrap 附加导航组件
2016/07/22 Javascript
vue-router路由懒加载和权限控制详解
2017/12/13 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
2017/12/22 Javascript
vue实现form表单与table表格的数据关联功能示例
2019/01/29 Javascript
Vue使用watch监听一个对象中的属性的实现方法
2019/05/10 Javascript
layer.alert回调函数执行关闭弹窗的实例
2019/09/11 Javascript
[01:35:53]完美世界DOTA2联赛PWL S3 Magma vs GXR 第二场 12.13
2020/12/17 DOTA
python读写二进制文件的方法
2015/05/09 Python
Python实现屏幕截图的代码及函数详解
2016/10/01 Python
R vs. Python 数据分析中谁与争锋?
2017/10/18 Python
python类的方法属性与方法属性的动态绑定代码详解
2017/12/27 Python
Python将DataFrame的某一列作为index的方法
2018/04/08 Python
opencv转换颜色空间更改图片背景
2019/08/20 Python
基于Python实现拆分和合并GIF动态图
2019/10/22 Python
基于python2.7实现图形密码生成器的实例代码
2019/11/05 Python
python 用Matplotlib作图中有多个Y轴
2020/11/28 Python
python制作抽奖程序代码详解
2021/01/15 Python
台湾三立电视电商平台:电电购
2019/09/09 全球购物
Viking Direct爱尔兰:办公用品和家具
2019/11/21 全球购物
医药工作者的求职信范文
2013/09/21 职场文书
电大自我鉴定
2013/10/27 职场文书
社保转移委托书范本
2014/10/08 职场文书
2015年度优秀员工自荐书
2015/03/06 职场文书
会议承办单位欢迎词
2015/09/30 职场文书
最新最全的手机号验证正则表达式
2022/02/24 Javascript
PYTHON InceptionV3模型的复现详解
2022/05/06 Python
MySQL主从切换的超详细步骤
2022/06/28 MySQL