<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的添加以及显示隐藏菜单的使用的更多相关文章

  1. 可以兼容ie6的纯CSS三级鼠标悬停显示/隐藏菜单实现

    本来在chrome上用js写的好好的三级显隐菜单,放到ie6上一测试竟然奇葩般的会瞎闪.问题原因至今没参透,可能是我每次响应事件的处理代码过长??总之我是对ie6幻灭了,去网上搜一搜能支持ie6的下拉 ...

  2. Android上实现各种风格的隐藏菜单,比如左右滑动菜单、上下滑动显示隐藏菜单

    Android上的菜单展示风格目前是各式各样的,但用的最多且体验最好的莫过于左右滑动来显示隐藏的菜单本示例实现了各种方式的菜单展示效果,只有你想不到的源码:https://github.com/Sim ...

  3. WinForm实现类似QQ停靠，显示隐藏过程添加特效效果

    原文:WinForm实现类似QQ停靠,显示隐藏过程添加特效效果 这可能是个老题长谈的问题了,只是在项目中会用到这个效果,所以今天做个记录.大家见了别喷我.在项目中的需求是这样的. 打开程序,在屏幕的右 ...

  4. [Easyui - Grid]为easyui的datagrid、treegrid增加表头菜单，用于显示或隐藏列

    为easyui的datagrid.treegrid增加表头菜单,用于显示或隐藏列 /** * @author 孙宇 * * @requires jQuery,EasyUI * * 为datagrid. ...

  5. easyui datagrid里的toobar按钮隐藏、显示、禁用等方式的实现

    easyui datagrid里的toobar按钮隐藏.显示.禁用等方式的实现 //隐藏第一个按钮 $('div.datagrid-toolbar a').eq(0).hide(); //隐藏第一条分 ...

  6. winform学习（4）控件的添加、显示和隐藏

    窗体的添加.显示与隐藏 可以直接通过工具栏将某个控件直接拖动至UI界面(也可以在工具栏里双击某个控件) 也可以在代码里直接添加:窗体的标识.Controls.Add(控件标识符); Button my ...

  7. Easyui datagrid 显示隐藏列

    html:         <div style="float: left; width: 1450px; height:auto;  ">             & ...

  8. jq点击改变元素样式、添加类，显示隐藏，图标旋转，再次点击还原；表格点击显示下拉详情

    点击前 点击后 <tr> <td class="right" data-id="{$vo.id}" id="{$vo.id}&quo ...

  9. 布局-EasyUI Panel 面板、EasyUI Tabs 标签页/选项卡、EasyUI Accordion 折叠面板、EasyUI Layout 布局

    EasyUI Panel 面板 通过 $.fn.panel.defaults 重写默认的 defaults. 面板(panel)当做其他内容的容器使用.它是创建其他组件(比如:Layout 布局.Ta ...

随机推荐

  1. 2015，我的投资理财策略（股权众筹+P2P网贷+活期理财）

    纸币流行,尤其是当今中国的市场经济,纸币几乎是一直是贬值的,每个人的财富都在被不断地稀释,可能是被政府.如果你不注意保值增值,你就越来越穷.     当年的万元户,在今天看来就是一个笑话,其实不怎么好 ...

  2. C# 进程同步，通信

    进程之间通讯的几种方法:常用的方法有:1.使用内存映射文件2.通过共享内存DLL共享内存3.使用SendMessage向另一进程发送WM_COPYDATA消息.   发送WM_COPYDATA消息 比 ...

  3. 为什么我要选择erlang+go进行server架构(2)

    原创文章,转载请注明出处:server非业余研究http://blog.csdn.net/erlib 作者Sunface 为什么我要选择Erlang呢? 一.erlang特别适合中小团队创业: erl ...

  4. Android ListView带CheckBox实现单选

    第1种方法: 首先是我们的bean: public class Bean { private boolean isChecked; private String msg = "这是一条测试数 ...

  5. mangodb学习0.1 概念

    摘自菜鸟教程

  6. 10.10 android输入系统_APP获得并处理输入事件流程

    APP对fd/InputChannel的注册过程: new WindowInputEventReceiver extends InputEventReceiver//InputEventReceive ...

  7. fdopen：让文件描述符像文件一样使用

    FILE * fdopen(int fildes,const char * mode); fdopen与fopen类似,返回一个FILE *类型的值,不同的是此函数以文件描述符而非文件作为参数. 如果 ...

  8. WIN32得到HWND

    HWND hwndFound //= FindWindow(_T("RC352_Win32"),NULL); = GetConsoleWindow();

  9. ping localhost 没反应解决方式

    今天在搭建导师公司的spark的集群的时候须要有一台机器须要ssh 到自己.可是运行以下两条命令后发现没有反应 ping localhost ping 127.0.0.1 之后问了下别人,发现是/et ...

  10. ps树叶的雕刻

    1.学习了图层建立,通道复制,通道载如.图层复制粘贴透明,色阶改动(ctrl+L),蒙板建立(必须不在背景上),蒙板刻图.蒙板画画(白色,黑色),蒙板填充(ctrl+backspace),(atrl+ ...