Firefox返回时Iframe的显示Bug的解决方法

<script type="text/javascript">//<![CDATA[
if(getCookie('firefoxIframe')){
document.write('<p id="addAd"><a href="cookie.html">点击这里删除这个iframe</a></p>');
document.write('<iframe height="120" width="300" marginheight="0" marginwidth="0"
frameborder="0" src="nAdPre.swf"></iframe>');
}else{
document.write('<p id="addAd"><a href="cookie.html">点击这里增加一个iframe</a></p>');
}
//]]></script>
打开Bug演示，由于cookie不存在，显示的三个flash都是通过Iframe实现的 
点击“点击这里增加一个iframe广告”，跳转到一个新的页面写入名为firefoxIframe的Cookie 
点击“返回”或者浏览器的返回按钮，回到Bug演示页面，发现iframe里面的flash错位，即位置2的iframe链接的flash并没有载入，显示的是位置3的flash，位置3的显示的是位置4的flash，位置4的flash却依旧存在。 
关闭标签页(不是关闭整个浏览器，如果关闭整个浏览器Cookie也失效)或新打开一个标签页重新载入该页面，4个Iframe正常显示4个flash 
此时如果点击“点击这里删除这个iframe广告”，跳转到新页面删除Cookie，返回也发现Iframe中的flash错位 
如果写入Cookie或者删除Cookie时，不通过浏览器的返回，直接通过网址访问，则不会出现错位 
简单分析和解决方案
似乎Firefox返回时，Javascript重新执行了，但是Iframe并未依据src属性重新载入，而是给Iframe和src以类似编号似的配对，而由于返回时Javascript的执行，导致Iframe多了一个（或少了一个），这就导致后面的配对错位。

以上仅为猜测，但这的确是Firefox（2.0.0.3）的一个bug，IE返回时Javascript重新执行，并且Iframe的依据src重新载入，Opera返回时Javascript不重新执行，页面没有变化。

解决方案是在文本中增加一个隐藏的Iframe来占位，上面代码修改如下代码如下：

document.write('<p id="addAd"><a href="cookie.html">点击这里增加一个iframe</a></p>');
//把上面的代码修改成为
document.write('<iframe src="#" style="display:none;"></iframe>');
document.write('<p id="addAd"><a href="cookie.html">点击这里增加一个iframe</a></p>');

赞 (0)

相关推荐

  • Firefox返回时Iframe的显示Bug的解决方法

    <script type="text/javascript">//<![CDATA[ if(getCookie('firefoxIframe')){ document.write('<p id="addAd"><a href="cookie.html">点击这里删除这个iframe</a></p>'); document.write('<iframe height="

  • iOS中导航栏pop返回时出现黑块问题的解决方法

    iOS中导航栏pop返回时出现黑块问题的解决方法

    前言 苹果在iOS7以后给导航控制器加了一个Pop手势,只要手指在屏幕边缘滑动,当前的控制器的视图就会随着你的手指移动,当用户松手后,系统会判断手指拖动出来的大小来决定是否要执行控制器的pop操作. 这个想法非常棒,但最近在使用中发现了一些问题,下面话不多说了,来一起看看详细的介绍吧. 问题描述: 导航栏正常从A页面push到B页面,从B页面pop返回A页面时遇到过渡过程中导航栏出现黑块的问题. 如截图所示: 问题原因: A界面导航栏被影藏,B页面的导航栏存在.过渡的时候没有动画. 解决方案:

  • Firefox2中输入框丢失光标bug的解决方法

    虽然庆幸的是Firefox3中解决了这个bug,但Firefox3还在beta阶段,取代Firefox2还是需要一些时间的,下面就来仔细说一下这个问题: 一.样式为{position:absolute;}的容器中的表单输入框在样式为类似{overflow:auto;}的容器区域中失去光标 可以通过例一到例六来了解最常见的情况. 如果想整个body都出现失去光标,可以设置html和body两个容器,请看示例.包括举例的overflow:auto在内能引起该Bug的overflow属性共有: ove

  • Android Studio 3.5格式化布局代码时错位、错乱bug的解决

    更新到3.5版本后,格式化布局文件代码,会自动给排序元素,导致界面布局错乱 解决办法: 设置 > code style > XML 右上角 Set from然后选择Predefined Style...>Android即可 补充知识:Android Studio:Reformat Code格式化Xml布局代码后控件顺序错乱 Android Studio升级3.5之后,遇到个奇葩问题,在布局xml文件中格式化代码后,控件的顺序都变了,这不是我们想要的结果,网上搜了一下,确实是AS3.5的锅

  • VS2019中scanf返回值被忽略的问题及其解决方法

    VS2019中scanf返回值被忽略的问题及其解决方法

    昨天在使用Visual Studio 2019编写C语言程序时遇到了scanf返回值被忽略问题 因为我也是刚开始学习C语言,第一次遇到这种问题,也不知道怎么回事,然后就上Chrome研究了一番,才知道原因,并且找到了几种分散在个个角落的解决方法,我在这里归纳总结一下. 问题原因: 在ANSI C中只有scanf(),没有scanf_s(),但是scanf()在读取时不检查边界,所以可能会造成内存泄漏.于是Microsoft公司在VS编译器中提供了scanf_s(),如果想继续使用scanf这个不

  • Python异常之常见的Bug类型解决方法

    目录 一.粗心导致的语法错误SyntaxError 1.input输入报错 2.循环语句报错 3.赋值报错 二.知识不熟练导致的错误Bug 1.索引越界问题 IndexError 2.append()函数的使用报错 三.思路不清晰导致的问题解决方案 1.使用print()函数 2.使用"#"暂时注销部分代码 四.被动掉坑 一.粗心导致的语法错误SyntaxError 1.input输入报错 age=input('请输入你的年龄:') if age>=18:     print(&

  • 关于JavaScript实现动画时动画抖动的原因与解决方法

    关于JavaScript实现动画时动画抖动的原因与解决方法

    目录 使用定时器实现动画出现卡顿的原因 requestAnimationFrame 的前世今生 requestAnimationFrame VS setInterval 参考资料 总结 前段时间在使用 JavaScript 做动画的时候发现做出来的动画会出现卡顿的现象,今天我们主要就来聊一下卡顿的原因以及如何解决这个问题. 使用定时器实现动画出现卡顿的原因 主要原因是浏览器无法确定定时器的回调函数的执行时机.以 setInterval 为例,当一个 setInterval 定时器被创建后,它的回

  • fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法

    本文实例讲述了fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法.分享给大家供大家参考,具体如下: 当部署含有Fckeditor编辑器的应用程序时,在tomcat下什么问题都没有,但当部署到weblogic下的时候就会碰到样式下拉菜单显示不出来和模板也提示没有模板,有的还会碰见 Error loading "/fckeditor/fckstyles.xml" Do you want to see more info? 这样的提示, 出现这个问题的原因

  • PHP CURL采集百度搜寻结果图片不显示问题的解决方法

    PHP CURL采集百度搜寻结果图片不显示问题的解决方法

    1.根据关键字采集百度搜寻结果 根据关键字采集百度搜寻结果,可以使用curl实现,代码如下: <?php function doCurl($url, $data=array(), $header=array(), $timeout=30){ $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_HTTPHEADER, $header); curl_setopt($ch, CURLOPT_R

  • 基于Linux系统中python matplotlib画图的中文显示问题的解决方法

    最近想学习一些python数据分析的内容,就弄了个爬虫爬取了一些数据,并打算用Anaconda一套的工具(pandas, numpy, scipy, matplotlib, jupyter)等进行一些初步的数据挖掘和分析. 在使用matplotlib画图时,横坐标为中文,但是画出的条形图横坐标总是显示"框框",就去查资料解决.感觉这应该是个比较常见的问题,网上的中文资料也确实很多,但是没有任何一个彻底解决了我遇到的问题.零零碎碎用了快3个小时的时间,才终于搞定.特此分享,希望能帮到有同

随机推荐