您的位置：首页 > 其它

一个iframe,点击每个tab加载相应的页面进来iframe

2011-08-30 16:27 471 查看

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title></title>
<link href="../gstyle/listpage.css" rel="stylesheet" type="text/css" />
<link href="../gstyle/easyui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../javascript/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../javascript/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../javascript/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
$(function () {
//设置自适应高度
$('#tt').height(window.document.documentElement.scrollHeight-40);
$('#tt').tabs({
onSelect: function (title) {
loadHtmlFile(title);
}
});
});

function loadHtmlFile(title) {
switch (title) {
case "A":
{
$("#A").attr("src", "A_Tab.htm");
break;
}
case "B":
{
$("#B").attr("src", "B_Tab.htm");
break;
}
case "C":
{
$("#C").attr("src", "C_Tab.htm");
break;
}
case "D":
{
$("#D").attr("src", "D_Tab.htm");
break;
}
case "E":
{
$("#E").attr("src", "E_Tab.htm");
break;
}
case "F":
{
$("#F").attr("src", "F_Tab.htm");
break;
}
}
}

$(window).resize(function () {
resizeTabs();
});
function resizeTabs() {
$('#tt').tabs('resize');
}
</script>
</head>
<body>
<div class="bodyDiv">
<div id="tt" class="pagetabs">
<div title="A" style="overflow: auto; padding: 0px;">
<iframe id="A" src="" frameborder="0" style="width: 100%; height: 100%"></iframe>
</div>
<div title="B" style="overflow: auto; padding: 0px;">
<iframe id="B" frameborder="0" src="" style="width: 100%; height: 100%;"></iframe>
</div>
<div title="C" style="overflow: auto; padding: 0px;">
<iframe id="C" src="" frameborder="0" style="width: 100%; height: 100%"></iframe>
</div>
<div title="D" style="overflow: auto; padding: 0px;">
<iframe id="D" src="" frameborder="0" style="width: 100%; height: 100%"></iframe>
</div>
<div title="E" style="overflow: auto; padding: 0px;">
<iframe id="E" src="" frameborder="0" style="width: 100%; height: 100%"></iframe>
</div>
<div title="F" style="overflow: auto; padding: 0px;">
<iframe id="F" src="" frameborder="0" style="width: 100%; height: 100%"></iframe>
</div>
</div>
</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航