返回上一个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 相关文章推荐
贴一个在Mozilla中常用的Javascript代码
Jan 09 Javascript
HTML 自动伸缩的表格Table js实现
Apr 01 Javascript
关于JavaScript对象的动态选择及遍历对象
Mar 10 Javascript
jQuery中attr()方法用法实例
Jan 05 Javascript
深入理解JavaScript系列(22):S.O.L.I.D五大原则之依赖倒置原则DIP详解
Mar 05 Javascript
详解BootStrap中Affix控件的使用及保持布局的美观的方法
Jul 08 Javascript
微信支付 JS API支付接口详解
Jul 11 Javascript
JS获取url参数、主域名的方法实例分析
Aug 03 Javascript
canvas实现刮刮卡效果
Mar 14 Javascript
使用AngularJS对表单提交内容进行验证的操作方法
Jul 12 Javascript
微信小程序实现上传图片功能
May 28 Javascript
Vue项目如何引入bootstrap、elementUI、echarts
Nov 26 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中模拟POST传递数据的两种方法分享
2011/09/16 PHP
php删除文件夹及其文件夹下所有文件的函数代码
2013/01/23 PHP
php中switch与ifelse的效率区别及适用情况分析
2015/02/12 PHP
Display SQL Server Version Information
2007/06/21 Javascript
IE event.srcElement和FF event.target 功能比较
2010/03/01 Javascript
new Date()问题在ie8下面的处理方法
2014/07/31 Javascript
nodejs 提示‘xxx’ 不是内部或外部命令解决方法
2014/11/20 NodeJs
javascript的tab切换原理与效果实现方法
2015/01/10 Javascript
Bootstrap里的文件分别代表什么意思及其引用方法
2017/05/01 Javascript
AngularJS 限定$scope的范围实例详解
2017/06/23 Javascript
node跨域请求方法小结
2017/08/25 Javascript
浅谈Angular路由守卫
2017/08/26 Javascript
node.js的exports、module.exports与ES6的export、export default深入详解
2017/10/26 Javascript
vue一个页面实现音乐播放器的示例
2018/02/06 Javascript
js实现动态改变radio状态的方法
2018/02/28 Javascript
JavaScript简单实现关键字文本搜索高亮显示功能示例
2018/07/25 Javascript
Vue快速实现通用表单验证的示例代码
2020/01/09 Javascript
jquery传参及获取方式(两种方式)
2020/02/13 jQuery
JavaScript中如何调用Java方法
2020/09/16 Javascript
python登录QQ邮箱发信的实现代码
2013/02/10 Python
Python SQLAlchemy基本操作和常用技巧(包含大量实例,非常好)
2014/05/06 Python
python3实现抓取网页资源的 N 种方法
2017/05/02 Python
Python 中的参数传递、返回值、浅拷贝、深拷贝
2019/06/25 Python
在tensorflow中实现屏蔽输出的log信息
2020/02/04 Python
Pycharm2020.1安装无法启动问题即设置中文插件的方法
2020/08/07 Python
Django 权限管理(permissions)与用户组(group)详解
2020/11/30 Python
基于CSS3实现图片模糊过滤效果
2015/11/19 HTML / CSS
美国二手奢侈品寄售网站:TheRealReal
2016/10/29 全球购物
创立科技Java面试题
2015/11/29 面试题
自荐书模板
2013/12/15 职场文书
物流专业求职计划书
2014/01/10 职场文书
《阳光》教学反思
2014/02/23 职场文书
药品营销策划方案
2014/06/15 职场文书
爱心捐赠活动简讯
2015/07/20 职场文书
《月歌。》宣布制作10周年纪念剧场版《RABBITS KINGDOM THE MOVIE》
2022/04/02 日漫
Python docx库删除复制paragraph及行高设置图片插入示例
2022/07/23 Python