在做页面统计的时候遇到了两个问题:

1.包含iframe的页面,在IE下按后退按钮不能刷新主页面。隐藏Iframe的src是统计程序的url,每点一次后退,就会发出一次页面加载时间请求。

2.由js动态创建的img标签会发出两个http请求,第一个请求在发出后就被aborted,但实际上统计脚本收到了该请求,造成数据重复入库。

针对第一个问题,怀疑是IE针对iframe处理同firefox不同。后来查资料才知道,IE会把iframe访问过的页面也记录进history,点击后退按钮时,其实是重新载入iframe中的url,因此表面上看起来是主页面不能刷新,其实隐藏的iframe是刷新了的,因此会造成点后退按钮发出不希望的请求。

针对第二个问题,IE处理动态创建的img,在设置img.src时会发出图片请求,因此把img.src放到appenChild方法之后设置就可以避免这种情况。

附iframe在不同浏览器下的表现:

AJAX教程: 两种iframe的区别 (怎样控制浏览器的history)

浏览器history记录了我们访问的页面。当点击浏览器的后退或者前进按钮时候,就会在history中记录页面之间进行跳转。有时候,因为各种原因,程序员需要控制什么页面被放进浏览器的history中,哪些页面不放进去。把这种针对history的控制当做一种原型来看,它可以被用在更加复杂的AJAX和DHTML应用中。在这里,我会讲述两类iframe,当你面临AJAX设计问题或者遇到这两类iframe引起的奇怪bug时,这些知识将会非常有用。

有两类iframe,一种是在HTML文档中静态存在的iframe:

另外一种是在页面加载后动态创建的iframe:

好了,我们已经知道有两类iframe,但是谁在意这个事实呢?但是,不同的浏览器在是否将他们放入history的决策上有完全不同的表现!

下面我们来看看真相。
Firefox:

如果iframe是静态存在在HTML中时,iframe的任何src或者location改变都会被记录到浏览器history中。

如果iframe是在页面加载完成后动态创建的,那么iframe的任何src或者location改变都不会被记录到浏览器history中。

IE:

两种iframe的src或者location改变都会被记录到浏览器history中。

Safari:

两种iframe的src或者location改变都不会被记录。

通过下面两个例子可以看到我们的结论。两个例子我们都会动态改变iframe的location,分别加载四个不同的页面。

下面我们看两个例子

在第一例中,iframe是在HTML页面中静态存在的,当改变几次iframe的location后,在IE和Firefox的history中都记录了这几个页面地址。点击后退和前进按钮时,iframe中加载的页面会改变。
在第二例中,iframe是页面加载完成后,由js动态创建的。Firefox下只有主页面在浏览器history中,而IE下不仅主页面,而且iframe加载的所有页面都在history中。

注:当一个iframe在HTML页面中静态存在时,并且该iframe有初始化了的src属性,如

那么改src指向的url不会被记录在浏览器history中,只有iframe的src或location被成功改变后指向的url才会被记录。

因此,我们可以使用这两类iframe的特殊行为来实现我们想要的效果。比如,可以让通过CSS将iframe设置为不可见,然后选择这两种iframe中的一种来决定是否让浏览器记录iframe加载过的页面url。

iframe中的历史记录问题汇总及解决方案[转]的更多相关文章

  1. H5项目常见问题汇总及解决方案

    H5项目常见问题汇总及解决方案 H5   2015-12-06 10:15:33 发布 您的评价:       4.5   收藏     4收藏 H5项目常见问题及注意事项 Meta基础知识: H5页 ...

  2. H5 常见问题汇总及解决方案

    原文链接:http://mp.weixin.qq.com/s/JVUpsz9QHsNV0_7U-3HCMg H5 项目常见问题汇总及解决方案 -- 由钟平勇分享 转自 https://github.c ...

  3. 解析Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作,需要的朋友可以参考下   DOM方法:父窗口操作IFRAME:window.frames[&q ...

  4. 在其他系统Iframe中显示SharePoint 页面

    前段时间在做一个项目,要求将SharePoint 的 OWA(Office Web Apps)中的文档显示页面嵌入到另外一个OA系统中,提供给用户可以通过浏览器查看SharePoint文档的能力. 嵌 ...

  5. 在iframe中使用cookie需要注意

    cookie的使用早已不新鲜了,但是最近在做项目时还是被坑了一把. 那么接下来让我们来看一下这个"坑"是个什么情况! 前提: 1.现在有两个页面A.html, B.html,同时, ...

  6. flume常见异常汇总以及解决方案

    flume常见异常汇总以及解决方案 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 实际生产环境中,我用flume将kafka的数据定期的往hdfs集群中上传数据,也遇到过一系列的坑 ...

  7. 【转】使用kettle工具遇到的问题汇总及解决方案

    使用kettle工具遇到的问题汇总及解决方案   转载文章版权声明:本文转载,原作者薄海 ,原文网址链接 http://blog.csdn.net/bohai0409/article/details/ ...

  8. 使用ubuntu过程中遇到的问题汇总

    使用ubuntu过程中遇到的问题汇总 1.使用图形界面设置免密码登录之后,改回密码登陆失效 解决方案: https://askubuntu.com/questions/211084/how-do-i- ...

  9. iframe中的页面在IE全屏模式下没有滚动条,正常模式有滚动条

    这个问题在其他浏览器都不会出现,唯独IE不行,搜遍了百度以及各大论坛网站,都找不到这个问题的解决方案,只好自己整了. 造成这个问题的原因很简单,就是刚开始的滚动条我用的是iframe的滚动条,ifra ...

随机推荐

  1. 个人作业-week3案例分析

    第一部分 软件调研测评(必应词典移动端) 找到的bug: 在词汇量测试中每个单词给用户思考的时间太短,只有五秒钟.导致很多似曾相识的单词还没来得及想起就已经过了.如果说测的是用户记忆深刻的单词,那些记 ...

  2. docker删除为<none>的镜像

    $ docker stop $(docker ps -a | grep "Exited" | awk '{print $1 }')  //停止容器      $ docker rm ...

  3. 开发 | 如何在微信小程序的页面间传递数据?

    我们在之前发布过小程序页面传值方法的简单介绍,说明了在小程序开发中,两种常见的页面之间传值方法. 本期,知晓程序(微信号 zxcx0101)为你带来的是「倒数记日」小程序开发者带来的,小程序开发中,有 ...

  4. error_reporting 报错

    <?php // 关闭所有PHP错误报告 error_reporting(0); // 报告简单的运行错误 error_reporting(E_ERROR | E_WARNING | E_PAR ...

  5. (转)web性能优化

    前端是庞大的,包括 HTML. CSS. Javascript.Image .Flash等等各种各样的资源.前端优化是复杂的,针对方方面面的资源都有不同的方式.那么,前端优化的目的是什么 ? 1. 从 ...

  6. JS 把数组按倒序排列

    var achearr=[1,2,3,4]; var bchearr=[]; //方法1: for (var i = 0; i <=achearr.length;i++) { bchearr.p ...

  7. Robot Framework 的安装配置和简单的实例介绍

    Robot Framework 介绍 Robot Framework 是一款基于 Python 的功能自动化测试框架.它具备良好的可扩展性,支持关键字驱动,可以同时测试多种类型的客户端或者接口,可以进 ...

  8. 测试人员如何"提问"

    本文打算谈谈QA如何高质量的“提问”   写这些的初衷其实比较简单,作为一个测试老鸟,加入了一些很有质量的测试圈子,也在不同的公司带过不少新人,常常会碰到低效率的“提问”,主要表现如下:   1.问题 ...

  9. 使用Java连接HBASE过程中问题总结

    本文是我个人在连接服务器的HBASE过程的一些问题总结. 一.用户和主机名的设置 1.1 报错:Insufficient permissions(user=Administartor) 原因:本地ho ...

  10. digitalworld.local: MERCY靶机入侵

    0x01 前言 MERCY是一个致力于PWK课程安全的靶机系统.MERCY是一款游戏名称,与易受攻击的靶机名称无关.本次实验是攻击目标靶机获取root权限并读系统目录中的proof.txt信息 靶机的 ...