页面中存在iframe时刷新页面的问题
来源:互联网 发布:bash 数组 编辑:程序博客网 时间:2024/05/29 15:16
近期在开发中遇到一个很奇怪的问题:HTML页面中有个iframe,初始情况下是空的,当点击特定按钮后iframe会加载特定页面。
但很快就发现有点问题了:当iframe加载了特定页面后,此时只要按F5刷新页面,iframe仍然会显示刚刚加载过的页面,而不是初始化时的空页面。
但更奇怪的事是:同样的HTML代码,只要把文件名改为php(其他动态语言脚本没有试过)就不会出现上面的问题,
另外如果使得Ctrl+F5强制刷新,不管是html和php也都没有发生上面的问题。
示例代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML> <HEAD> <TITLE></TITLE> <script type="text/javascript"> var initFrame = function(){test.location='http://www.baidu.com'; }; var clearFrame = function(){test.location='about:blank'; }; </script> </HEAD> <BODY> <pre> 说明: 刚开始iframe并没有内容,点击加载后才有内容 但此时刷新下页面,iframe内仍然会显示加载后的内容 而不是空内容,这时需要增加清除iframe内容的代码来解决此问题 但时在php程序中,此情况不会发生,刷新页面时iframe内容显示为空 </pre> <iframe name="test" src="" width=100% height="300px" border=0></iframe> <div><a href="javascript:initFrame()">加载iframe</a><a href="javascript:location=location">刷新页面</a><a href="javascript:clearFrame()">清空iframe</a> </div> <script> //clearFrame(); </script> </BODY></HTML>
为此我做了多次试验,总结出结论如下:
文件类型\刷新方式F5Ctrl+F5JS
location=location
location.replace(location)
JS
location.reload
history.go(0)
测试环境:Win7 64bit IE9/Firefox14
结论:
1、相同的代码,动态脚本和静态HTML执行结果还是有差异的
2、页面中嵌套iframe在进行页面可能会有”缓存“(不知道用这个词是否合适)
3、JS不同刷新页面的方式会有不同效果,类似location=location的方式类相当于强制刷新,iframe里的内容也会初始化;类似location.reload的方式并不会初始化iframe里的内容,iframe内会保持之前的状态。
要想让以上所有的方式都不会有iframe显示异常的情况也很好办,只要增加一段 js初始化iframe的代码就可以了
上面示例代码中
//clearFrame();这一行前面的注释去掉即可。
另外,iframe也会有其他一些烦人的问题如:iframe内打开链接问题、跳转异常问题、JS问题等
所以很多时候iframe并不是一个好的方案,最后劝大家一句:iframe有风险,使用前请谨慎。
原创内容,转载请注明出处
http://blog.csdn.net/rainday0310/article/details/7933280
- 页面中存在iframe时刷新页面的问题
- 关于iframe中嵌套的页面刷新的问题
- 页面只刷新iframe中iframe的页面
- IFrame页面的刷新
- 页面中存在多个iframe时iframe内容异常问题
- iframe实现页面的刷新
- iframe实现页面的刷新
- 解决iframe作为子窗口,刷新后iframe页面跳转到其它页面的问题
- 子页面的Iframe刷新子页面的Iframe
- 当页面存在ajax请求时的iframe自适应高度问题
- iframe中JS刷新整个页面
- html中iframe控制父页面刷新
- iframe下刷新页面无法刷新当前页面的解决办法
- iframe刷新parent页面
- iframe刷新父页面
- iframe刷新页面
- iframe刷新父页面
- iframe刷新父页面
- linux中文安装方法
- Himi浅谈4年游戏开发de自学历程!(牛人是如何学习的)
- Today is a new start!!
- android之ION内存管理器(2)-- cache
- JavaScript学习(二)
- 页面中存在iframe时刷新页面的问题
- C内存分配机制
- JavaScript学习(三)
- Java实现对文件的压缩和解压缩
- web系统流量控制
- JavaScript学习(四)
- dedecms 上传图片出现ERROR:Copy Uploadfile Error!提示
- 数组左边减去右边数值的最大差值
- ffdshow开发笔记——从安装到构建成功第一个FilterGraph(一)