index.jsp源码
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <c:set var="ctx" value="${pageContext.request.contextPath }" /> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>index</title> <!--导入easyui资源文件--> <link rel="stylesheet" type="text/css" href="${ctx }/static/easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="${ctx }/static/easyui/themes/icon.css"> <script type="text/javascript" src="${ctx }/static/easyui/jquery-1.12.0.min.js"></script> <script type="text/javascript" src="${ctx }/static/easyui/locale/easyui-lang-zh_CN.js"></script> <script type="text/javascript" src="${ctx }/static/easyui/jquery.easyui.min.js"></script> </head> <body class="easyui-layout"> <!--north导航部分start--> <div data-options="region:'north',border:false" class="easyui-layout" style="height:50px;background:#B3DFDA;padding:4px;"> <div class="easyui-layout"> <div style="float: left;"><h2 style="margin-top: 6px;padding-left: 10px;">EasyUI 后台管理</h2></div> <div style="float: right;" id="nav"> <ul style="list-style: none;"> <li style="float: left;">欢迎你，<strong>超级管理员</strong></li> <li style="float: left;margin-left: 10px;"> <strong><a href="#" style="text-decoration: none;color:#436EEE;">退出</a></strong> </li> </ul> </div> </div> </div><!--north导航部分end--> <!--west（西）侧边导航部分start--> <div data-options="region:'west',split:true,title:'主菜单'" style="width:150px;padding:2px;"> <div class="easyui-accordion" data-options="fit:true,border:true"> <div title="客户管理" data-options="iconCls:'icon-search',selected:false" style="padding:10px;"> <ul class="easyui-tree"> <li><a href="javascript:;" onclick="addTabByTitle(this)">客户列表</a></li> <li><a href="javascript:;" onclick="addTabByTitle(this)">客户添加</a></li> </ul> </div> <div title="系统设置" data-options="iconCls:'icon-ok'" style="padding:10px;"> <ul class="easyui-tree"> <li><a href="#">客户列表</a></li> <li><a href="">客户列表</a></li> </ul> </div> <div title="帮助" data-options="iconCls:'icon-help'" style="padding:10px"> <ul class="easyui-tree"> <li><a href="">客户列表</a></li> </ul> </div> </div> </div><!--west（西）侧边导航部分end--> <!--south底部部分start--> <div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;"> <div class="easyui-layout" style="text-align: center;line-height: 27px;"> Copyright ©2019-2099 easyui.admin v3.1 All Rights Reserved. 本后台系统由easyui提供前端技术支持 </div> </div><!--south底部部分end--> <!--center主要部分start--> <div data-options="region:'center',title:'控制台'"> <div id="tt" class="easyui-tabs" data-options="tools:'#tab-tools',fit:true" style=""> <div title="起始页" data-options="fit:true,plain:true,selected:true,border:true" style="padding:5px;"></div> <div title="客户列表" data-options="href:'${ctx }/customer/toCustList.action',closable:true" style="padding:10px;"></div> </div> </div><!--center主要部分end--> </body> <script type="text/javascript"> function addTabByTitle(obj){ var title = $(obj).html(); alert(title); $('#tt').tabs('add',{ title: title, content: '<div style="padding:10px"></div>', closable: true }); } </script> </html> 如下
温馨提示：若看不到图片，请换Google浏览器试试