IE中JS跳转丢失referrer问题的2个解决方法


Posted in Javascript onJuly 18, 2014

曾整理过一个各种页面跳转方法中referrer丢失的情况,其中提到,在IE中,使用类似 location.href = "a.html"这样的方式跳转页面时,在目标页面中 document.referrer的值会是空。这应该是IE的一个 bug。

大多数情况下,这个问题不会给我们带来麻烦,但有时候我们不得不用JavaScript来跳转,同时又要在下一个页面收集 document.refer,这时就得想想其他办法了。

Form GET方法

首先想到的是使用Form表单,用JS发起一个GET请求。代码类似下面这样:

function goToPage(url) {

    if (isIE) {

        // IE浏览器

        var frm = document.createElement("form");

        frm.action = url;

        frm.method = "GET";

        document.body.appendChild(frm);

        frm.submit();

    } else {

        // 非IE

        location.href = url;

    }

}

这个方法可以如同预期地工作,目标页面中 document.referrer能正常指向上一个页面。

A元素模拟点击方法

网上搜索了一下,发现司徒正美的博客上记录了这个问题的另一个处理方法:

//define for all browsers

function goto(url) {

    location.href = url;

}
//re-define for IE

if (isIE) {

    function goto(url) {

        var referLink = document.createElement('a');

        referLink.href = url;

        document.body.appendChild(referLink);

        referLink.click();

    }

}

原理很简单,先创建了一个 A元素,指定其 href属性为目标链接,然后再使用JS触发它的点击事件。经测试,在目标页面也能正常取到 document.referrer。

这个方法代码更简短一点,应该比上面的使用 form表单的方案更好一些。

Javascript 相关文章推荐
javascript hasFocus使用实例
Jun 29 Javascript
JavaScript 更严格的相等 [译]
Sep 20 Javascript
javascript获取元素偏移量的方法有哪些
Jun 24 Javascript
jQuery中:button选择器用法实例
Jan 04 Javascript
莱鸟介绍javascript onclick事件
Jan 06 Javascript
12个非常实用的JavaScript小技巧【推荐】
May 18 Javascript
浅谈js函数的多种定义方法与区别
Nov 29 Javascript
基于Javascript倒计时效果
Dec 22 Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 Javascript
JavaScript函数的特性与应用实践深入详解
Dec 30 Javascript
express如何解决ajax跨域访问session失效问题详解
Jun 20 Javascript
javascript中layim之查找好友查找群组
Feb 06 Javascript
JavaScript中的document.referrer在各种浏览器测试结果
Jul 18 #Javascript
javascript的document.referrer浏览器支持、失效情况总结
Jul 18 #Javascript
jQuery控制的不同方向的滑动(向左、向右滑动等)
Jul 18 #Javascript
JQuery对表单元素的基本操作使用总结
Jul 18 #Javascript
jQuery新的事件绑定机制on()示例应用
Jul 18 #Javascript
jQuery中attr()和prop()在修改checked属性时的区别
Jul 18 #Javascript
$.each遍历对象、数组的属性值并进行处理
Jul 18 #Javascript
You might like
php面向对象全攻略 (十六) 对象的串行化
2009/09/30 PHP
ueditor 1.2.6 使用方法说明
2013/07/24 PHP
php中url传递中文字符,特殊危险字符的解决方法
2013/08/17 PHP
php实现兼容2038年后Unix时间戳转换函数
2015/03/18 PHP
PHP7常量数组用法分析
2016/09/26 PHP
php实现和c#一致的DES加密解密实例
2017/07/24 PHP
JavaScript.The.Good.Parts阅读笔记(二)作用域&闭包&减缓全局空间污染
2010/11/16 Javascript
DWR实现模拟Google搜索效果实现原理及代码
2013/01/30 Javascript
js使浏览器窗口最大化实现代码(适用于IE)
2013/08/07 Javascript
javascript实现字符串反转的方法
2015/02/05 Javascript
函数window.open实现关闭所有的子窗口
2015/08/03 Javascript
javascript实现右侧弹出“分享到”窗口效果
2016/02/01 Javascript
浅谈javascript基础之客户端事件驱动
2016/06/10 Javascript
深入浅析jQuery对象$.html
2016/08/22 Javascript
Angular项目中$scope.$apply()方法的使用详解
2017/07/26 Javascript
微信小程序缓存过期时间的使用详情
2019/05/12 Javascript
vue 组件开发原理与实现方法详解
2019/11/29 Javascript
[04:05]TI9战队采访 - Natus Vincere
2019/08/22 DOTA
详解python使用递归、尾递归、循环三种方式实现斐波那契数列
2018/01/16 Python
Python多线程扫描端口代码示例
2018/02/09 Python
在Django中URL正则表达式匹配的方法
2018/12/20 Python
python中bs4.BeautifulSoup的基本用法
2019/07/27 Python
python logging通过json文件配置的步骤
2020/04/27 Python
Python爬虫JSON及JSONPath运行原理详解
2020/06/04 Python
OpenCV4.1.0+VS2017环境配置的方法步骤
2020/07/09 Python
scrapy头部修改的方法详解
2020/12/06 Python
利用纯CSS3实现文字向右循环闪过效果实例(可用于移动端)
2017/06/15 HTML / CSS
美国最大的珠宝商之一:Littman Jewelers
2016/11/13 全球购物
奥地利手表、香水、化妆品和珠宝购物网站:Brasty.at
2021/01/17 全球购物
The North Face意大利官网:服装、背包和鞋子
2020/06/17 全球购物
销售行政专员职责
2014/01/03 职场文书
蛋糕店创业计划书
2014/05/06 职场文书
民主评议党员自我评价材料
2014/09/18 职场文书
学习党的群众路线对照检查材料
2014/09/29 职场文书
2015年安康杯竞赛活动总结
2015/03/26 职场文书
唱歌比赛拉拉队口号
2015/12/25 职场文书