left_menu.jsp
<%@ 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>
<%@include file="/jsp/common/taglibs.jsp"%>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="${ctxCss}/comm.css" type="text/css">
<link rel="stylesheet" href="${ctxCss}/zTreeStyle.css" type="text/css">
<script src="${ctxJs}/common/jquery-1.9.0.js" type="text/javascript"></script>
<script src="${ctxJs}/common/jquery-ui-1.9.2.custom.min.js"
type="text/javascript"></script>
<script type="text/javascript"
src="${ctxJs}/common/jquery.ztree.core-3.5.js"></script>
<title>Insert title here</title>
</head>
<body>
<div id="accordion" class="sidebar">
<h3>
<div class="nav">
<span class="ico f_left"></span> <a href="#" target="content"
class="f_left">资源模型</a> <a class="ico up f_right"></a>
</div>
</h3>
<div class="nav_con" style=" overflow:auto;z-index:10000;">
<li class="bg_gray" id ="tools"><span class="ico export f_right" title="导出"></span><span
class="ico import f_right" title="导入"></span><span
class="ico delete f_right" title="删除"></span><span
class="ico copy f_right" title="复制"></span>
</li>
<div class="zTreeDemoBackground left" style="height:500px">
<ul id="treeDemo" class="ztree"></ul>
</div>
</div>
<h3>
<div class="nav" id="indicatorsOfLibrary" >
<span class="ico f_left"></span> <a href="#" target="content"
class="f_left">指标库</a> <a class="ico up f_right"></a>
</div>
</h3>
<div id="indicatorsOfLibrary">Second content</div>
<h3>
<div class="nav" id="indicatorsOfGroup" >
<span class="ico f_left"></span> <a href="#" target="content"
class="f_left">指标组</a> <a class="ico up f_right"></a>
</div>
</h3>
<div id="indicatorsOfGroup" >Second content</div>
<h3>
<div class="nav">
<span class="ico f_left"></span> <a href="#" target="content"
class="f_left">厂商相关管理</a> <a class="ico up f_right"></a>
</div>
</h3>
<div class="nav_con">
<ul>
<li class="bg_gray"><span class="ico export f_right" title="导出"></span><span class="ico import f_right" title="导入"></span></li>
<li class="tree" style="height padding-right:20px;">
<p><a class="ico pro f_left" οnclick="index.aaaaa()"></a>厂商及型号管理</p>
<p><a class="txt_on"><a class="ico pro f_left"></a>厂商MIB管理</p>
<p><a class="ico pro f_left"></a>背板管理</p>
</li>
</ul>
</div>
<h3>
<div class="nav">
<span class="ico f_left"></span> <a href="#" target="content"
class="f_left">申请管理</a> <a class="ico up f_right"></a>
</div>
</h3>
<div>Second content</div>
</div>
<script type="text/javascript" src="${ctxJs}/resourcemodel/left_menu.js"></script>
<script type="text/javascript" src="${ctxJs}/resourcemodel/accordion.js"></script>
</body>
</html>
left_menu.js
var setting = { view : { showLine : false }, data : { simpleData : { enable : true } } }; $(document).ready(function() { $.ajax({ url : ctx+"/resourceModelTreeController/getModelTree", data : "", type : "post", dataType : "json", success : function(data) { var zNodes = data.treeJson; $.fn.zTree.init($("#treeDemo"), setting, zNodes); } }); });
accordion.js
var accordion = { init : function(){ accordion.accordionInit(); accordion.collapse(); }, collapse : function(){ $( "#accordion" ).accordion({ activate: function( event, ui ) { console.log(ui); if(ui.newPanel[0].id === "indicatorsOfLibrary"){ var iframedom = $('#model_add')[0]; iframedom.src = ctx+"/paramlibrary/listparam?pageNow=1"; } if(ui.newPanel[0].id === "indicatorsOfGroup"){ var iframedom = $('#model_add')[0]; iframedom.src = ctx+"/paramgroup/list?pageNow=1"; } if(ui.newPanel[0].id === "indicatorsOfGroup"){ var iframedom = $('#model_add')[0]; iframedom.src = ctx+"/paramgroup/list?pageNow=1"; } } }); }, accordionInit : function(){ $("#accordion").accordion(); } } $(document).ready(function(){ accordion.init(); });