刷新页面时错误的内容包含IE中的iframe [英] Wrong content when refresh a page contains iframes in IE

问题描述

在测试页'index.html'的内容中：
测试链接

 < h2 id =at>< / h2> 
< div id =a>< / div> 
< h2 id =bt>< / h2> 
< div id =b>< / div> 
< h2 id =ct>< / h2> 
< div id =c>< / div> 
< h2 id =dt>< / h2> 
< div id =d>< / div> 
 
< script> 
变种包装= [的document.getElementById（ 'A'），的document.getElementById（ 'B'），的document.getElementById（ 'C'），的document.getElementById（ 'd'）]，
标题= [的document.getElementById（ '在'），的document.getElementById（ 'BT'），的document.getElementById（ 'CT'），的document.getElementById（ 'DT'）]，
 ARR = [ '一个'， 'b'，'c'，'d'，'e'，'f'，'g']，
l，
i，
r; （i = 0; i <4; i ++）{
 l = arr.length; 
 
; 
 r = Math.floor（Math.random（）* l）; 
 titles [i] .innerHTML ='iframe'+ arr [r] .toUpperCase（）; 
 wrapps [i] .innerHTML ='< iframe src =''+ arr [r] +'.htmlframeborder =1width =600height =60>< / iframe> ;'; 
 arr.splice（r，1）; 
} 
< / script> 
  

其中a-g.html文件包含示例代码。当在IE中第一次打开index.html（我在IE 11中测试）时，它显示正确的内容。然后刷新这个页面，这些iframe的src属性会改变，但内容不会改变，只是保持与第一次加载相同。

这个问题只存在于IE时刷新。

我找到了两个解决方案：

1）将iframe添加到页面中，然后将其设置为src由js;

2）在http serer中禁用缓存

但是这两个选项都不好，我想要要知道是否有其他解决问题的方法。

一些失败的测试：

1）为网址添加随机字符串

2）通过在iframe头部添加元标记来禁用缓存

解决方案

您可以在iframe的网址末尾添加（伪）随机字符串。

类似这样：

  var randValue =（new Date（））。getTime（）; 
 wrapps [i] .innerHTML ='< iframe src =''+ arr [r] +'.html？cache ='+ randValue +'frameborder =1width =600height = 60\" >< / iframe中>'; 
  

更新
<看来，IE正在从缓存中提供iFrames的内容。
如果您在IE中检查网络面板，它会显示 HTTP状态代码304 。

你可能想看这篇文章 Internet Explorer IFRAME浏览器历史记录丢失重新加载。这可能会为您提供解决问题的可能方案。

In a test page 'index.html' whose content: Test link

<h2 id="at"></h2>
<div id="a"></div>
<h2 id="bt"></h2>
<div id="b"></div>
<h2 id="ct"></h2>
<div id="c"></div>
<h2 id="dt"></h2>
<div id="d"></div>

<script>
    var wraps = [document.getElementById('a'), document.getElementById('b'), document.getElementById('c'), document.getElementById('d')],
        titles = [document.getElementById('at'), document.getElementById('bt'), document.getElementById('ct'), document.getElementById('dt')],
        arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g'],
        l,
        i,
        r;

    for (i = 0; i < 4; i++) {
        l = arr.length;
        r = Math.floor(Math.random() * l);
        titles[i].innerHTML = 'iframe ' + arr[r].toUpperCase();
        wraps[i].innerHTML = '<iframe src="' + arr[r] + '.html" frameborder="1" width="600" height="60"></iframe>';
        arr.splice(r, 1);
    }
</script>

where a-g.html are files contain sample code. When open index.html first time in IE(i test in IE 11), it displays correct content. Then refresh this page, these iframes' src attributes change, but there content don't change, just keep the same as the first time load.

This problem only exist in IE when refresh.

I found tow options to solve it:

1)add iframe to page first, then set it's src by js;

2)disable cache in http serer

But this two options are not good, I want to know is there any other way to solve the problem.

Some failed tests:

1)add random string to url

2)disable cache by adding meta tag in iframe's head

解决方案

You can add a (pseudo) random string to the end of the URL of your iframe.

Something like this:

var randValue = (new Date()).getTime();
wraps[i].innerHTML = '<iframe src="' + arr[r] + '.html?cache=' + randValue + '" frameborder="1" width="600" height="60"></iframe>';

Updated

It seems that IE is serving the content of the iFrames out of it's cache. If you check the network panel in IE it shows a HTTP status code 304.

You might want to look at this article Internet Explorer IFRAME Browser History Lost on Reload. This might give you a possible solution to your problem.

这篇关于刷新页面时错误的内容包含IE中的iframe的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！