<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. java中的switch用String作为条件

    在开发java程序的过程中,我们遇到了条件推断首选就是switch,可是java中的switch功能不支持字符串作为条件.这时我们该怎么办呢? --使用枚举. 一.枚举简单了解    1.enum是一 ...

  2. shrio 权限管理filterChainDefinitions过滤器配置(转)

    /** * Shiro-1.2.2内置的FilterChain * @see ============================================================= ...

  3. leetcode-combination sum and combination sum II

    Combination sum: Given a set of candidate numbers (C) and a target number (T), find all unique combi ...

  4. 修复STS4 server中没有Tomcat的问题(必看,官方推荐,包教包会,国内首发)

    版权声明:原创.欢迎转载,转载请注明来源,谢谢. https://blog.csdn.net/qq_41910280/article/details/83279129 修复STS4 server中没有 ...

  5. OpenGL_ES-纹理

    OpenGL_ES2.0 -纹理 一:纹理基础: 1: 纹素的概念: 一个二维纹理在OpenGLES2.0中是非经常见的,二维纹理就是一个二维数组,每一个数据元素称为纹素,详细格式例如以下: GL_R ...

  6. vim修复，telnet安装启动，linux更新软件源

     vim修复: 修复前提,你到UBUNTU能够联网.否则仅仅能卸载,不能安装 1.sudo apt-get remove vim-common 2.sudo apt-get install vim ...

  7. 【2006】求N!的精确值

    Time Limit: 3 second Memory Limit: 2 MB 对于阶乘函数,即使自变量较小,其函数值也会相当大.例如: 10!＝3628800 25!＝155112100433309 ...

  8. [Now] Update an application hosted with Zeit’s Now

    Because now deploys are immutable, you can’t push changes to a running instance - you just push a ne ...

  9. itunes app 下载链接的几种表现形式

    第一种:itunes://itunes.apple.com/cn/app/id794862904 ,这是最普通的一种. 直接在浏览器中输入.就能够打开电脑上安装的itunes,并跳转到相应的app下载 ...

  10. [Vue] Use Vue.js Component Computed Properties

    You can add computed properties to a component to calculate a property on the fly. The benefit of th ...