easyui之tabs

创建tab

<div id="mainTab" class="easyui-tabs" data-options="fit:true">
				<div title="主页" style="padding: 20px; ">
					<p style="font-size: 14px">jQuery EasyUI framework helps you
						build your web pages easily.</p>
					<ul>
						<li>easyui is a collection of user-interface plugin based on
							jQuery.</li>
						<li>easyui provides essential functionality for building
							modem, interactive, javascript applications.</li>
						<li>using easyui you don't need to write many javascript
							code, you usually defines user-interface by writing some HTML
							markup.</li>
						<li>complete framework for HTML5 web page.</li>
						<li>easyui save your time and scales while developing your
							products.</li>
						<li>easyui is very easy but powerful.</li>
						<li> <input type="button"  value="addTab" onclick="addTab();"/></li>
					</ul>

				</div>
			</div>

创建添加tab的function:

function addTab(title,url){
                //如果存在tab，激活该tab为选中状态,return.
		if($("#mainTab").tabs('exists',title)){
			$("#mainTab").tabs('select',title);
			return;
		}
		//不存在，创建一个新德tab
		$("#mainTab").tabs("add",{
			title:'新tab1',
			closable:true,
			content:'<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>'
		});
	}