jQuery 如何使 <iframes> 仅在单击按钮时加载?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12102464/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I make <iframes> load only on a button click?
提问by Alex Spencer
Friends, My issue is that my page is really slow to load, because all of the load simeltaneously. I am pulling an RSS feed that if you click on the "article" button it will pop up a Modal that has the inside of it. The problem is that all of the s load simeltaneously.
朋友们,我的问题是我的页面加载真的很慢,因为所有的加载都是同步的。我正在拉一个 RSS 提要,如果你点击“文章”按钮,它会弹出一个包含它的模态。问题是所有的 s 都同时加载。
here is the site: http://daisy.camorada.com/
这是网站:http: //daisy.camorada.com/
I have tried inserting a src into the but that doesn't work because i guess the iframe loads when the page opens.
我试过在 src 中插入一个 src ,但这不起作用,因为我猜 iframe 在页面打开时加载。
<button class='btn btn-primary' id='miguel'>TEST ME NOW</button>
<button class='btn btn-primary' id='jamison'>jamison</button>
<div id="yoyoyo">
</div>
<iframe id="gogo">
</iframe>
<script>
$('#miguel').on('click', function() {
alert('clicked');
$('#gogogo').attr('href', 'http://www.google.com');
});
</script>
<script>
$('#jamison').on('click', function() {
alert('clicked JAMISON');
$("#yoyoyo").html("<h1>HELLO J</h1><br><iframe class='full-iframe' href='http://news.yahoo.com/three-killed-tribal-clash-libya-001717827.html'></iframe>");
});
</script>
回答by ahren
Html:
网址:
<iframe id="myiFrame" data-src="http://my.url" src="about:blank">
</iframe>
In your jQuery:
在你的 jQuery 中:
$("button").click(function(){
var iframe = $("#myiFrame");
iframe.attr("src", iframe.data("src"));
});
Or if you wanted to load ALL iframes when you click one button... make sure they all have a data-src="your.url"
attribute, and then loop through like this:
或者,如果您想在单击一个按钮时加载所有 iframe... 确保它们都有一个data-src="your.url"
属性,然后像这样循环:
$("button").click(function(){
$("iframe").each(function(){
$(this).attr("src", $(this).data("src"));
});
});
回答by sachleen
First, you don't have an element $('#gogogo')
. The frame is #gogo
.
首先,你没有 element $('#gogogo')
。框架是#gogo
。
Second, set it's src
not href
二、设置src
不是href
$("#myframe").attr('src', 'http://site.com');
If you just want to set it to some HTML and not a URL, use this:
如果您只想将其设置为某些 HTML 而不是 URL,请使用以下命令:
$("#myframe").contents().find('html').html("hello");
回答by Sista Fiolen
<a href="http://example.com" target="myiFrame">Click me!</a>
<iframe name="myiFrame" src="about:blank">
No JavaScript required.
不需要 JavaScript。