码迷,mamicode.com
首页 > 其他好文 > 详细

layout

时间:2015-12-28 23:24:41      阅读:179      评论:0      收藏:0      [点我收藏+]

标签:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>layout布局</title>

<script type="text/javascript" src="js/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="js/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="js/themes/icon.css">
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>

<script type="text/javascript" src="js/locale/easyui-lang-zh_CN.js"></script>

<script>
$(function(){
    
    $("#useradd").click(function(){
        
        var title=$(this).html();
        //var title=$(this).text();
        
        if($(‘#tt‘).tabs(‘exists‘,title))
            {
            $(‘#tt‘).tabs(‘select‘,title);
            }
        else
        {
            $(‘#tt‘).tabs(‘add‘,{    
                title:title,    
                content:‘Tab Body‘,    
                closable:true,    
                tools:[{    
                    iconCls:‘icon-mini-refresh‘,    
                    handler:function(){    
                        alert(‘refresh‘);    
                    }    
                }]    
            });  
        }


    });
})

</script>
</head>
<body class="easyui-layout">   
    <div data-options="region:‘north‘,title:‘North Title‘,split:true" style="height:100px;"></div>   
<!--     <div data-options="region:‘south‘,title:‘South Title‘,split:true" style="height:100px;"></div>   
    <div data-options="region:‘east‘,iconCls:‘icon-reload‘,title:‘East‘,split:true,iconCls:‘icon-add‘" style="width:100px;"></div>    -->
    <div data-options="region:‘west‘,title:‘功能菜单‘,split:true,expandMode:‘float‘" style="width:200px;">
    
    <div id="aa" class="easyui-accordion" data-options="fit:true" style="width:300px;height:200px;">   
    <div title="用户管理" data-options="iconCls:‘icon-save‘" style="overflow:auto;padding:10px;">   
          <a id="useradd" href="#">用户添加</a><br>
          <a id="useradd1" href="#">用户编辑</a><br>
          <a id="useradd2" href="#">用户删除</a>
    </div>   
    <div title="系统设置" data-options="iconCls:‘icon-reload‘" style="padding:10px;">   
        content2    
    </div>   
    <div title="部门设置">   
        content3    
    </div>   
    </div>
    
    </div>   
    <div data-options="region:‘center‘,title:‘主界面‘" style="padding:5px;background:#eee;">
    
    <div id="tt" class="easyui-tabs" data-options="fit:true,selected:0" style="width:500px;height:250px;">   
    <div title="Tab1" style="padding:20px;">   
        tab1    
    </div>   
    <div title="Tab2" data-options="closable:true" style="overflow:auto;padding:20px;">   
        tab2    
    </div>   
    <div title="Tab3" data-options="iconCls:‘icon-reload‘,closable:true" style="padding:20px;">   
        tab3    
    </div>   
    </div>  
    
    </div>   
</body>  


</html>

 

layout

标签:

原文地址:http://www.cnblogs.com/zxw0004/p/5084321.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!