单击重新加载多个iframes
单击重新加载多个iframes
提问于 2017-05-19 08:08:46
我遇到了一个问题，多年来一直在寻找答案。我有一些iframes，里面有不同的HTML5横幅。但是它们都同时启动，所以我需要在循环通过标签时重新加载iframe。
HTML看起来像：
<div class="main" >
<input type="radio" id="tab-1" name="show" checked/>
<input type="radio" id="tab-2" name="show" />
<input type="radio" id="tab-3" name="show" />
<input type="radio" id="tab-4" name="show" />
<input type="radio" id="tab-5" name="show" />
<input type="radio" id="tab-6" name="show" />
<input type="radio" id="tab-7" name="show" />
<div class="tab">
<label for="tab-1">320x320</label>
<label for="tab-2">300x250</label>
<label for="tab-3">300x600</label>
<label for="tab-4">320x160</label>
<label for="tab-5">160x600</label>
<label for="tab-6">930x600</label>
<label for="tab-7">930x180</label>
</div>
<div class="content">
<div class="content-dis">
<div>
<a href="http://n" target="_blank" class="the-click"></a>
<iframe id="iframe" src="https://b" width="320px" height="320px" frameborder="0" scrolling="no"></iframe>
</a>
</div>
</div>
<div class="content-dis">
<div >
<a href="http://n" target="_blank" class="the-click"></a>
<iframe id="iframe" src="https://b" width="300px" height="250px" frameborder="0" scrolling="no"></iframe>
</div>
</div>*编辑应该提到，iframe内容位于不同的域上。
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-05-19 09:21:37
如果您动态地将src添加到iframe中，它应该一得到它就会加载。
因此，例如，如果在单击选项卡时添加iFrame的src，那么它应该只在此时加载。
您可以有一个数组(键是iframe的ID，值是url值)，也可以在html本身中将url作为元标记添加，然后在javascript代码中使用它填充iframe的src标记。
下面是一个简单的例子，向您展示基本思想：
$('#test').on('click', function (){
$("iframe").each(function() {
var attr;
attr = $(this).attr('data-frame-src');
if (typeof attr !== typeof void 0 && attr !== false) {
$(this).attr('src', attr);
}
});
});https://codepen.io/NickHG/pen/wdQLqR?editors=1010
帧的src在单击按钮时加载。
目前，我正在将src添加到所有iframe中，但是您可以轻松地使用框架id作为参数来运行函数，并且只添加iframe src。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/44064742
复制相关文章
相似问题
腾讯云开发者
