EasyUI Tabs

使用js来加载tab，防止多次加载

举例：

html代码

<body>
	<div id="tt" class="easyui-tabs"></div>
</body>

tab js调用方法

$(function() {
	var titleArray = [ "基本信息", "其它信息" ];
	var urlArray = [ "view?guid=${guid}", "other?guid=${guid}" ];

	loadTab(titleArray, urlArray);
});

js加载方法

function loadTab(titleArray, urlArray) {

	for (var i = 0; i < titleArray.length; i++) {
		var content = '<iframe class="frame-size" src="' + urlArray[i] + '"></iframe>';
		$('#tt').tabs('add', {
			title : titleArray[i],
			content : content
		});
	}

	// 默认选中第一个
	$('#tt').tabs({
		selected : 0
	});

	// 高度自适应
	$(".frame-size").height($("body").height() - $(".tabs-header").height());
}

iframe自适应

iframe {
	 100%;
	height: 100%;
	border: 0;
}

以前使用的方法，使用easyui-tabs来加载内容，使用iframe来展示内容

<body>
	<div id="tt" class="easyui-tabs">
		<div title="基本信息" data-options="selected:true"><iframe class="frame-size" src="view?guid=${guid}"></iframe></div>
		<div title="其它信息"><iframe class="frame-size" src="other?guid=${guid}"></iframe></div>
	</div>
</body>