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 { width: 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>