function init() { var treeData = [ { text : "菜单", children : [ { text : "一级菜单1", attributes : { url : "editDataGrid2.do" } }, { text : "一级菜单2", attributes : { url : "" } }, { text : "一级菜单3", state : "closed", children : [ { text : "二级菜单1", attributes : { url : "" } }, { text : "二级菜单2", attributes : { url : "" } }, { text : "二级菜单3", attributes : { url : "" } } ] } ] } ]; //实例化树形菜单 $("#tree").tree({ data : treeData, lines : true, onClick : function (node) { if (node.attributes) { Open(node.text, node.attributes.url); } } }); //在右边center区域打开菜单,新增tab function Open(text, url) { var contents ='<iframe id="tabs_'+text+'" scrolling="auto" frameborder="0" src="" style="width:100%; height:99%">fdfdf</iframe>'; if ($("#tabs").tabs('exists', text)) { $('#tabs').tabs('select', text); } else { $('#tabs').tabs('add', { title : text, closable : true, content : contents }); } $("#tabs_"+text).attr("src", url);//redEx.do //url } }
<div region="west" class="west" title="NAVIGATION"> <ul id="tree"></ul> </div>
<div id="conter" data-options="region:'center'" style="overflow:hidden;"> <div id="tabs" class="easyui-tabs" data-options="fit:true,border:false" style="border: 0px solid;width: 100%; height: 100%;"> </div> </div>
相关推荐
EasyUI 是一个基于 jQuery 的 UI 框架,它提供了丰富的组件和易于使用的主题,用于快速构建美观且功能强大的 Web 应用程序。在“easyui页面布局示例”中,我们将探讨如何利用 EasyUI 实现高效且直观的页面布局,并...
jQuery EasyUI 是一个基于 jQuery 的用户界面插件集合,它提供了丰富的 UI 控件来帮助开发者快速构建用户界面。这些控件不仅功能强大而且易于使用,极大地简化了前端开发工作。 #### 二、jQuery EasyUI 控件概述 ...
同时,还需要定义一个回调函数,用于处理节点被点击时的事件,例如弹出新窗口或者在Tab面板中加载内容。 ```javascript var setting = { view: {selectedMulti: false}, edit: {enable: true}, data: {simple...
在上述代码中,`zTreeOnClick`函数会根据用户点击的节点,动态创建一个iframe或者在zTree的tab页中加载相应的内容。这使得开发者可以轻松地为每个节点绑定具体的页面内容。 在实际开发中,开发者需要根据自己的需求...
总结来说,JEECG UI标签库为开发者提供了一系列方便快捷的UI组件和功能标签,极大地简化了前端开发的工作量,提高了开发效率。无论是数据展示、表单验证还是国际化支持等功能,都可以通过这些标签轻松实现。通过以上...
G 39.12 easyui手风琴控件介绍1 X/ X# \' k% x2 N 40.13 tree控件 41.14 tab控件: U, |: a! S7 ?: A$ t1 ?, G 42.1.properties% C2 @ d! }9 Z& ^2 c 43.2.主键9 D3 f9 W4 J* C" B4 M 44.3. 锚点. F( v2 C8 q- I# F+...