多个Iframe向同一SRC发送一个请求 [英] Multiple Iframes sending ONE request to the same SRC

问题描述

我想知道是否有办法说3个iframe加载相同的资源( http://myservice.php )，其中只有来自iframe的一个请求. myservice.php返回一个Html文档，浏览器应该以某种方式加载html，而无需在加载的HTML文档中额外两次加载所有内容，包括CSS和JS.换句话说，只有第1个iframe发送的1个请求才能从myservice.php加载HTML文档，而其他2个iframe可以在不发送其他http请求的情况下加载相同的html.

I was wondering if there was a way to have say 3 iframes load the same resource (http://myservice.php) with ONLY ONE request from the iframe. The myservice.php returns an Html Document and the browser should somehow load the html without reloading everything 2 additional times including CSS and JS in the loaded HTML document. In other words, is it possible with ONLY 1 request sent from the 1st iframe to load the HTML document from myservice.php, and have the other 2 iframes load the same html without sending additional http requests.

<iframe id="iframe1" src="myservice.php"></iframe>//should send only request
<iframe id="iframe2" src="myservice.php"></iframe>//use the already loaded data without sending an additonal http request
<iframe id="iframe3" src="myservice.php"></iframe>

我曾考虑过用jsonp存储html(以避免跨域问题)并将其存储在变量中，但是我不确定它是否比默认方式与多个iframe向我发送多个http请求的效率更高.的PHP.另外，html的大小也很沉重，我认为这可能会影响浏览器.

I have thought about storing the html with jsonp(to avoid cross domain problems) and store it in a variable but i am not sure if it s more efficient than having the default way with multiple iframes sending multiple http requests to my .php. Also, the the size of the html is also heavy which i think can affect the browser.

推荐答案

我认为您需要为此使用JavaScript.

I think you need to use javascript for this.

带上框架，并为每个框架赋予不同的ID:

<iframe name="iframe1" id="f1" src="old.html"></iframe>
<iframe name="iframe2" id="f2" src="old.html"></iframe>
<iframe name="iframe3" id="f3" src="old.html"></iframe>

调用函数:

<a href="#" onClick="multipleFrames('new.html');">change iframes</a>

最好在函数中传递URL.这使您的代码更具可重用性.

It would be best to pass the URL in the function. This makes your code more reusable.

然后创建一个函数，将URL(u)传递给该函数.

function multipleFrames(u){ //url
    var frames=window.frames;
    for (var i=1; i<3; i++){

        var frame="f"+i;
        document.getElementById(frame).src = u;
    }
}

如果您在不同位置使用的iframe数量不同，则也可以传递iframe的数量

If you have a differing amount of iframes in different places you could pass the number of iframes as well

<a href="#" onClick="multipleFrames('new.html','3');">change iframes</a>

 

     function multipleFrames(u,n){ //url, number of iframes
                var frames=window.frames;
                var total=n+1;
                for (var i=1; i<total; i++){

...
}

这篇关于多个Iframe向同一SRC发送一个请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！