返回上一层html按钮,锁定浏览器返回上一层首页

Loading...

前几天遇到一个问题,有个页面需要做一个功能,功能并不复杂,需要浏览器点击返回的时候返回上层链接的首页。

这牵扯2个问题,1,有没有上一层目录。2,上一层是否是https。

其实很简单,下面是代码:

<!DOCTYPE html>

<html lang="zh"><head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>锁定浏览器返回上一层首页</title>

</head>

<body>

<p>锁定浏览器返回上一层首页</p>

<script>

$(function(){

//清空浏览器历史记录

pushHistory();

//监听浏览器后退事件

window.addEventListener("popstate",

function(e) {

//转向指定的URL

//获取上一层链接

var refurl = document.referrer;

//截取主域名

var refurlhost = refurl.split("/")[2];

//判定有没有上层目录,以及判定上层目录是不是https

if(refurl==""||refurl==null||refurl==undefined){

var refurlhostbalck ="/";

}else if(refurl.indexOf("https")>=0)

{

var refurlhostbalck ="https://"+refurlhost;

}else{

var refurlhostbalck ="http://"+refurlhost;

}

location.href=refurlhostbalck;

}, false);

//清空浏览器历史记录

function pushHistory() {

var url = "#";

var state = {

title: "title",

url: "#"

};

window.history.pushState(state, "title", "#");

}

});

</script>

</body>

</html>

最后修改:2019 年 07 月 06 日 03 : 50 PM

© 允许规范转载

赞赏

如果觉得我的文章对你有用,请随意赞赏

×Close

赞赏作者

扫一扫支付

png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAAA1JREFUCJljOHz4cAMAB2ACypfyMOEAAAAASUVORK5CYII=

png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAAA1JREFUCJljOHz4cAMAB2ACypfyMOEAAAAASUVORK5CYII=

支付宝支付

微信支付

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值