Javascript 使用 jquery 延迟加载 iframe(延迟 src http 调用)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7154958/
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
lazy load iframe (delay src http call) with jquery
提问by Steve
I am looking for something similar to jQuery image lazy load plugin, but for iframe
s.
我正在寻找类似于jQuery 图像延迟加载插件的东西,但对于iframe
s.
回答by alex
回答by technoTarek
A similar questionwas recently posted specific to iFrames with Twitter Bootstrap-based tabs, which I answeredusing a technique I'm calling Lazy Loading of iFrames. The js/jquery is as follows; see the full code including html markup in the fiddle or on my response to the OP:
最近发布了一个类似的问题,专门针对带有基于 Twitter Bootstrap 的选项卡的 iFrames,我使用一种我称之为Lazy Loading of iFrames的技术回答了这个问题。js/jquery 如下;查看完整代码,包括小提琴中的 html 标记或我对 OP 的回应:
<script>
$('#myTabs').bind('show', function(e) {
// identify the tab-pane
paneID = $(e.target).attr('href');
// get the value of the custom data attribute to use as the iframe source
src = $(paneID).attr('data-src');
//if the iframe on the selected tab-pane hasn't been loaded yet...
if($(paneID+" iframe").attr("src")=="")
{
// update the iframe src attribute using the custom data-attribute value
$(paneID+" iframe").attr("src",src);
}
});
</script>
回答by hawkeye126
If you want to do this in WordPress
如果您想在 WordPress 中执行此操作
Here is an automatic, request reducing, solution
这是一个自动减少请求的解决方案
In WordPress plugin form
以 WordPress 插件形式
Here is a WordPress plugin you can download and manually install via the WordPress plugin repository. I created this today just to handle this situation. No changes to content are needed, this works automatically once activated on any and all iframes.
这是一个 WordPress 插件,您可以通过 WordPress 插件存储库下载并手动安装。我今天创建这个只是为了处理这种情况。不需要更改内容,一旦在任何和所有 iframe 上激活,它就会自动工作。
回答by nickytonline
You could always intialize the src attribute to about:blank and then when your click event fires, set the src attribute to the URL you want to navigate to.
您始终可以将 src 属性初始化为 about:blank,然后当您的点击事件触发时,将 src 属性设置为您要导航到的 URL。
回答by wightnoise
Can you set the src to about:blank? Like this?
你能把 src 设置为 about:blank 吗?像这样?