我设置了8个标签和8个IFrame(每个标签1个),但它们似乎都在我的主页加载的同时执行。这是一个问题,因为每个页面都有自己的onload
函数可以运行,并在等待这些页面完成时挂起我的主页。
我希望只有在点击特定标签时才能运行IFrame。我该如何做到这一点?
<script>
$(function () {
$("#tabs").tabs({
active: 0,
beforeLoad: function (event, ui) {
if (ui.tab.data("loaded")) {
event.preventDefault();
return;
}
ui.jqXHR.success(function () {
ui.tab.data("loaded", true);
});
}
});
$('#tabs').css('border', '');
});
</script>
<div id="tabs">
<ul>
<li><a href="#Embed1">Home</a></li>
<li><a href="#Embed2">Page 1</a></li>
<li><a href="#Embed3">Page 2</a></li>
<li><a href="#Embed4">Page 3</a></li>
<li><a href="#Embed5">Page 4</a></li>
<li><a href="#Embed6">Page 5</a></li>
<li><a href="#Embed7">Page 6</a></li>
<li><a href="#Embed8">Page 7</a></li>
</ul>
<iframe id="Embed1" seamless="seamless" src="home.aspx" sandbox=""></iframe>
<iframe id="Embed2" seamless="seamless" src="page1.aspx" sandbox=""></iframe>
<iframe id="Embed3" seamless="seamless" src="page2.aspx" sandbox=""></iframe>
<iframe id="Embed4" seamless="seamless" src="page3.aspx" sandbox=""></iframe>
<iframe id="Embed5" seamless="seamless" src="page4.aspx" sandbox=""></iframe>
<iframe id="Embed6" seamless="seamless" src="page5.aspx" sandbox=""></iframe>
<iframe id="Embed7" seamless="seamless" src="page6.aspx" sandbox=""></iframe>
<iframe id="Embed8" seamless="seamless" src="page7.aspx" sandbox=""></iframe>
</div>
答案 0 :(得分:0)
如果你真的想使用Iframe(而你没有)。您必须以编程方式设置src
。
将src=
属性留空并使用jQuery加载它。
<button type="button" id="Button1">Load Iframe</button>
<iframe id="Embed1"></iframe>
<script type="text/javascript">
$(document).ready(function () {
$('#Button1').click(function () {
$("#Embed1").attr("src", "Page2.aspx")
})
});
</script>