关于easyui-accordion的添加以及显示隐藏菜单的使用
<script type="text/javascript"> $(function()
{
leftMenus();
}); function leftMenus()
{
var _menus=<%=jsonStr %>;
//$(".easyui-accordion").empty();
$.each(_menus.menus, function(i, n) {
$(".easyui-accordion").accordion('add',
{
title: n.text,
content:moduleIndex(n.menus)
});
});
$(".easyui-accordion").accordion();
$('.easyui-accordion li a').click(function()
{
var tabTitle = $(this).text();
var url = $(this).attr("href");
//alert(url);
addTab(tabTitle,url);
$('.easyui-accordion li div').removeClass("selected");
$(this).parent().addClass("selected");
}).hover(function()
{
$(this).parent().addClass("hover");
},function()
{
$(this).parent().removeClass("hover");
});
} function addTab(subtitle,url){
if(!$('#tabs').tabs('exists',subtitle)){
$('#tabs').tabs('add',{
title:subtitle,
content:createFrame(url),
closable:true,
width:$('#mainPanle').width()-10,
height:$('#mainPanle').height()-26
});
}else{
$('#tabs').tabs('select',subtitle);
}
//tabClose();
} function createFrame(url)
{
var s = '<iframe name="mainFrame" scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>';
return s;
} function moduleIndex(menusData)
{
var text="";
text += '<ul>';
$.each(menusData,function(j,o)
{
text += '<li><div ><a target="mainFrame" href="'+o.attributes+'" >' + o.text + '</a></div></li> ';
});
text += '</ul>';
return text;
}
</script>
<body id="cc" class="easyui-layout">
<div data-options="region:'west',split:true" title="导航菜单" style="width: 200px;">
<div class="easyui-accordion" data-options="fit:true,border:false"> </div>
</div>
<div id="mainPanle" data-options="region:'center'">
<div id="tabs" class="easyui-tabs" fit="true" border="false" >
<div title="欢迎使用" style="padding:20px;overflow:hidden;" id="home"> <h1>欢迎您使用,报表在线查询系统</h1> </div>
</div>
</div>
</body>
展示效果图片:

关于easyui-accordion的添加以及显示隐藏菜单的使用的更多相关文章
- 可以兼容ie6的纯CSS三级鼠标悬停显示/隐藏菜单实现
本来在chrome上用js写的好好的三级显隐菜单,放到ie6上一测试竟然奇葩般的会瞎闪.问题原因至今没参透,可能是我每次响应事件的处理代码过长??总之我是对ie6幻灭了,去网上搜一搜能支持ie6的下拉 ...
- Android上实现各种风格的隐藏菜单,比如左右滑动菜单、上下滑动显示隐藏菜单
Android上的菜单展示风格目前是各式各样的,但用的最多且体验最好的莫过于左右滑动来显示隐藏的菜单本示例实现了各种方式的菜单展示效果,只有你想不到的源码:https://github.com/Sim ...
- WinForm实现类似QQ停靠,显示隐藏过程添加特效效果
原文:WinForm实现类似QQ停靠,显示隐藏过程添加特效效果 这可能是个老题长谈的问题了,只是在项目中会用到这个效果,所以今天做个记录.大家见了别喷我.在项目中的需求是这样的. 打开程序,在屏幕的右 ...
- [Easyui - Grid]为easyui的datagrid、treegrid增加表头菜单,用于显示或隐藏列
为easyui的datagrid.treegrid增加表头菜单,用于显示或隐藏列 /** * @author 孙宇 * * @requires jQuery,EasyUI * * 为datagrid. ...
- easyui datagrid里的toobar按钮隐藏、显示、禁用等方式的实现
easyui datagrid里的toobar按钮隐藏.显示.禁用等方式的实现 //隐藏第一个按钮 $('div.datagrid-toolbar a').eq(0).hide(); //隐藏第一条分 ...
- winform学习(4)控件的添加、显示和隐藏
窗体的添加.显示与隐藏 可以直接通过工具栏将某个控件直接拖动至UI界面(也可以在工具栏里双击某个控件) 也可以在代码里直接添加:窗体的标识.Controls.Add(控件标识符); Button my ...
- Easyui datagrid 显示隐藏列
html: <div style="float: left; width: 1450px; height:auto; "> & ...
- jq点击改变元素样式、添加类,显示隐藏,图标旋转,再次点击还原;表格点击显示下拉详情
点击前 点击后 <tr> <td class="right" data-id="{$vo.id}" id="{$vo.id}&quo ...
- 布局-EasyUI Panel 面板、EasyUI Tabs 标签页/选项卡、EasyUI Accordion 折叠面板、EasyUI Layout 布局
EasyUI Panel 面板 通过 $.fn.panel.defaults 重写默认的 defaults. 面板(panel)当做其他内容的容器使用.它是创建其他组件(比如:Layout 布局.Ta ...
随机推荐
- jvisualvm 工具使用
VisualVM 是Netbeans的profile子项目,已在JDK6.0 update 7 中自带(java启动时不需要特定参数,监控工具在bin/jvisualvm.exe). https:// ...
- 实现indexOf
1.先判断Array数组是否含有indexOf方法,如果有直接返回结果:如果没有则利用循环比较得到结果. function indexOf(arr, item) { if(Array.prototyp ...
- 手动脱KBys Packer(0.28)壳实战
作者:Fly2015 吾爱破解培训第一课选修作业第5个练习程序.在公司的时候用郁金香OD调试该加壳程序的时候出了点问题,可是回家用吾爱破解版的OD一调试,浑身精神爽,啥问题也没有. 首先使用查壳工具对 ...
- iOS Universal Static Framework 手动转 XCode Cocoa Framework
不须要又一次创建Project,手动改动project设置. 第一步:在Project文件里,改动type,去掉static 1. 搜索wrapper.framework.static,去掉stati ...
- HTML/CSS 选择符优先级
CSS的选择符优先级 1.同级样式默认后者覆盖前者 2.样式优先级 类型(1) < class[type](10)=伪类(10) < id(100) < style行间样式(1000 ...
- 如何用Swift创建一个复杂的加载动画
现在在苹果应用商店上有超过140万的App,想让你的app事件非常具有挑战的事情.你有这样一个机会,在你的应用的数据完全加载出来之前,你可以通过一个很小的窗口来捕获用户的关注. 没有比这个更好的地方让 ...
- BZOJ 1588 HNOI2002 营业额统计 裸Treap
题目大意:...题目描写叙述不全看这里好了 给定一个序列 对于每一个元素我们定义该数的最小波动值为这个数与前面全部数的差中的最小值(第一个数的最小波动值为第一个数本身) 求最小波动值之和 找近期的数仅 ...
- Volley框架源代码分析
Volley框架分析Github链接 Volley框架分析 Volley源代码解析 为了学习Volley的网络框架,我在AS中将Volley代码又一次撸了一遍,感觉这样的照抄代码也是一种挺好的学习方式 ...
- Android JobService的使用及源码分析
Google在Android 5.0中引入JobScheduler来执行一些需要满足特定条件但不紧急的后台任务,APP利用JobScheduler来执行这些特殊的后台任务时来减少电量的消耗.本文首先介 ...
- Windows Phone 8.1 控件
如果你已经开始了 Windows Phone 8.1 的学习,就会发现许多在 8.0 下的控件在 8.1 中都发生了变化,以下就谈谈几个 8.1 下的新控件以及与 8.0 控件的改变. 1. Text ...