zoukankan      html  css  js  c++  java
  • iframe中的历史记录问题汇总及解决方案[转]

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

    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。

  • 相关阅读:
    yun2win-iOS端IM SDK使用方法
    题解
    普通乘法,加法等时间复杂度计算
    noip2014 解方程(本博文转载于http://blog.csdn.net/popoqqq/article/details/40984859,略有删减)
    检查
    关于对拍 (来自老胡)
    2014 NOIP 赛前自我整理提醒。
    USACO 2014 JAN 滑雪录像
    Vue 双向绑定原理
    Vue 路由
  • 原文地址:https://www.cnblogs.com/ranran/p/iframe_history.html
Copyright © 2011-2022 走看看