通过document.referrer判断页面是链接调整还是新打开以及来源

业务需求:

1、复制链接或者QQ中在浏览器中新打开的链接,点击“返回”跳转到列表页;

2、从列表页链接调整进的店“返回”执行浏览器的“返回”动作,好处是能直接定位到列表页上次浏览的位置。

function ClickBack(){
				if(document.referrer==""||document.referrer.indexOf("cases")==-1){
					//返回到案例列表
					window.location.href='/cases/';
					}else{
							history.back();
						}
			}

若新打开的页面document.referrer值即为“”

兼容性测试:

操作 IE6 IE7 IE8 IE9 Firefox Chrome Opera Safari
直接在地址栏输入URL “” “” “” “” “” “” “” “”
从书签访问URL “” “” “” “” “” “” “” “”
从页面A点击超链接,跳转到页面B(target=”_self”)
从页面A点击超链接,跳转到页面B(target=”_blank”)
从页面A右键单击超链接,在新标签页中打开页面B - “”
从页面A右键单击超链接,在新窗口中打开页面B “”
拖动链接到地址栏 “” 无法拖动 无法拖动 “” “” “” “” “”
拖动链接到标签栏 - “” “” “” “” “” “” “”
使用浏览器的前进、后退按钮
JS 修改 location.href “” “” “”
JS 使用 window.open “” “” “” “”
服务器重定向(302跳转) 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面
页面 Meta Refresh “” “” “” “” “” 转向页 转向页 转向页

上表中的“√”表示能正常取到 referrer,”” 表示 referrer 为空。

测试结果来自网络,作者不详,感谢分享。

操作 IE6 IE7 IE8 IE9 Firefox Chrome Opera Safari
直接在地址栏输入URL “” “” “” “” “” “” “” “”
从书签访问URL “” “” “” “” “” “” “” “”
从页面A点击超链接,跳转到页面B(target=”_self”)
从页面A点击超链接,跳转到页面B(target=”_blank”)
从页面A右键单击超链接,在新标签页中打开页面B - “”
从页面A右键单击超链接,在新窗口中打开页面B “”
拖动链接到地址栏 “” 无法拖动 无法拖动 “” “” “” “” “”
拖动链接到标签栏 - “” “” “” “” “” “” “”
使用浏览器的前进、后退按钮
JS 修改 location.href “” “” “”
JS 使用 window.open “” “” “” “”
服务器重定向(302跳转) 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面 定向之前的页面
页面 Meta Refresh “” “” “” “” “” 转向页 转向页 转向页

上表中的“√”表示能正常取到 referrer,”” 表示 referrer 为空。

时间: 2024-08-29 10:29:59

通过document.referrer判断页面是链接调整还是新打开以及来源的相关文章

JS判断页面是在浏览器还是微信打开

一.Navigator对象 1.获取用户的浏览器信息. let ua = navigator.userAgent.toLowerCase(); 打印一下ua的结果: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 //电脑是mac 也可以尝试在不同环境打印出来的值, 2.判断页面是在移动端还是PC端: l

javascript判断页面是否在移动设备上打开

var ua = navigator.userAgent; var ipad = ua.match(/(iPad).*OS\s([\d_]+)/), isIphone =!ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/), isAndroid = ua.match(/(Android)\s+([\d.]+)/), isMobile = isIphone || isAndroid; //判断 if(isMobile){ //执行是移动端时的代码 }else

document.readyState等属性,判断页面是否加载完

如何在页面加载完成后再去做某事?什么方法可以判断当前页面加载已完成?document.readyState 判断页面是否加载完成?javascript提供了document.readyState=="complete"方法来解决当前页面加载判断的问题. <script type="text/javascript">   function initView(){         if (document.readyState=="complete

JS获取上一访问页面URL地址document.referrer实践2

一.JS获取前一个访问页面的URL地址document.referrer 要获取前一个访问页面的URL地址前后端语言都可以,例如PHP的是$_SERVER['HTTP_REFERER'],JavaScript的就是document.referrer. 我们平常开发,虽然和URL打交道也算比较频繁,但是,似乎很少使用document.referrer.我起初以为是兼容性不好,后来测试发现ie7都支持,那就奇怪了,为何document.referrer用的不多呢? 我想了一下,可能有下面几个原因:

移动端返回上一页,刚需!document.referrer 详解

返回上一页,在PC端我们可以使用:history.go(-1)或者history.back(),可以正常返回第一层.这样,我们不需要上一页的 url 具体是什么,只要使用 history 一般都没啥问题. 但是在移动端,如果想要返回上一页.比如从A页面跳到B页面,如果B页面想返回A页面,为了防止不会跳错,必须要有一个 <  按钮,给它加 history.go(-1) ,返回上一层. <a href="javascript:history.go(-1)" class=&quo

document.referrer

只有当用户在上一个页面点击链接到达当前页面,document.referrer才会有值,当用户输入这一页的网址.通过response.redirect.用了ssl这些情况referrer都会为空.     另外,其必须通过http协议使用.否则不能得到返回值,即值为空.     可以借助这个属性来检查用户是否非法进入,如:   <html>    <head>        <meta http-equiv="Content-Type" content=&

JS判断页面是否出现滚动条

今天无聊,帮一个网友解决一个很无聊的问题,用JS判断页面是否出现滚动条,在网上看了一些代码,经过验证并不起作用,下面是在网上搜索到的代码: 当可视区域小于页面的实际高度时,判定为出现滚动条,即: if (document.documentElement.clientHeight < document.documentElement.offsetHeight) scroll = true; 要使用 document.documentElement ,必须在页面头部加入声明: <!DOCTYPE

[jquery]判断页面滚动到顶部和底部(适用于手机web加载)

//判断页面滚动到顶部和底部 $(window).scroll(function(){ var doc_height = $(document).height(); var scroll_top = $(document).scrollTop(); var window_height = $(window).height(); if(scroll_top == 0){ alert("到顶啦"); }else if(scroll_top + window_height >= doc

jQuery 判断页面元素是否存在

在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: document.getElementById("someID").innerHTML("hi"); 如果ID为"someID"的元素不存在,我们将得到Javascript运行错误:document.getElementById("someID") is null 正确的写法应该