zoukankan      html  css  js  c++  java
  • 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>
    

      

  • 相关阅读:
    AGC037F Counting of Subarrays
    AGC025F Addition and Andition
    CF506C Mr. Kitayuta vs. Bamboos
    AGC032D Rotation Sort
    ARC101F Robots and Exits
    AGC032E Modulo Pairing
    CF559E Gerald and Path
    CF685C Optimal Point
    聊聊Mysql索引和redis跳表
    什么是线程安全
  • 原文地址:https://www.cnblogs.com/fengzhentian/p/4792536.html
Copyright © 2011-2022 走看看