zoukankan      html  css  js  c++  java
  • 处理EasyUI中tab的切换问题以及accordion左侧导航栏的代码实现

     //左侧导航菜单
       function leftMenus()
       {
             //$(".easyui-accordion").empty();
             $.each(_menus.menus, function(i, n) {
                  $(".easyui-accordion").accordion('add',
                    {
                       title: n.text,
                       content:moduleIndex(n.menus),
                       iconCls:'icon-search'
                 });
            });
            $(".easyui-accordion").accordion();
            liClick();
       }
       
       function liClick()
       {
           $('.easyui-accordion li a').click(function()
            {
                var tabTitle = $(this).text();
                    /**
              *处理tab切换问题:将"href"修改成"way"。
              */
                var url = $(this).attr("way");
                addTab(tabTitle,url);//打开tab选项卡
                $('.easyui-accordion li div').removeClass("selected");
                $(this).parent().addClass("selected");
           }).hover(function()
           {
                $(this).parent().addClass("hover");
           },function()
           {
                $(this).parent().removeClass("hover");
           });
       }
       
       function moduleIndex(menusData)
       {
          var text="";
          text += '<ul>';
          $.each(menusData,function(j,o)
          {
          /**
          *处理tab切换问题:将‘a’标签中的"href"修改成"way"。
          */
              text += '<li><div ><a target="mainFrame" way="'+o.attributes+'" >' + o.text + '</a></div></li> ';
          });
          text += '</ul>';
          return text;
       }
       
       function addTab(subtitle,url)
       {
            if(!$('#tabs').tabs('exists',subtitle))
            {
                $('#tabs').tabs('add',{
                    title:subtitle,
                    content:createFrame(url),
                    closable:false,
                    $('#mainPanle').width()-10,
                    height:$('#mainPanle').height()-26,
                    iconCls:'icon-search'
                });
            }
            else
            {
                $('#tabs').tabs('select',subtitle);
            }
            tabClose();
        }
    
        function createFrame(url)
        {
            var s = '<iframe name="mainFrame" scrolling="auto" frameborder="0"  src="'+url+'" style="100%;height:100%;"></iframe>';
            return s;
        }
        
            function tabClose()
        {
            /*双击关闭TAB选项卡*/
            $(".tabs-inner").dblclick(function(){
                var subtitle = $(this).children("span").text();
                $('#tabs').tabs('close',subtitle);
            })
            
             //绑定右键菜单
            $(".tabs-inner").bind('contextmenu',function(e){
                $('#mm').menu('show', {
                    left: e.pageX,
                    top: e.pageY,
                });
    
                var subtitle =$(this).children("span").text();
                $('#mm').data("currtab",subtitle);
                
                return false;
            });
         }
        
        //绑定右键菜单事件
        function tabCloseEven()
        {
            //关闭当前
            $('#mm-tabclose').click(function(){
                var currtab_title = $('#mm').data("currtab");
                $('#tabs').tabs('close',currtab_title);
            })
            //全部关闭
            $('#mm-tabcloseall').click(function(){
                $('.tabs-inner span').each(function(i,n){
                    var t = $(n).text();
                    $('#tabs').tabs('close',t);
                });    
            });
            //关闭除当前之外的TAB
            $('#mm-tabcloseother').click(function(){
                var currtab_title = $('#mm').data("currtab");
                $('.tabs-inner span').each(function(i,n){
                    var t = $(n).text();
                    if(t!=currtab_title)
                        $('#tabs').tabs('close',t);
                });    
            });
            //关闭当前右侧的TAB
            $('#mm-tabcloseright').click(function(){
                var nextall = $('.tabs-selected').nextAll();
                if(nextall.length==0){
                    //msgShow('系统提示','后边没有啦~~','error');
                    alert('后边没有啦~~');
                    return false;
                }
                nextall.each(function(i,n){
                    var t=$('a:eq(0) span',$(n)).text();
                    $('#tabs').tabs('close',t);
                });
                return false;
            });
            //关闭当前左侧的TAB
            $('#mm-tabcloseleft').click(function(){
                var prevall = $('.tabs-selected').prevAll();
                if(prevall.length==0){
                    alert('到头了,前边没有啦~~');
                    return false;
                }
                prevall.each(function(i,n){
                    var t=$('a:eq(0) span',$(n)).text();
                    $('#tabs').tabs('close',t);
                });
                return false;
            });
    
            //退出
            $("#mm-exit").click(function(){
                $('#mm').menu('hide');
            })
        }
        
        /*进度条*/
        function progress(){
                var win = $.messager.progress({
                    title:'请稍等',
                    msg:'正在加载数据...'
                });
                setTimeout(function(){
                    $.messager.progress('close');
                },2000)
            }
  • 相关阅读:
    第十二周工作总结
    第八周工作总结
    冲刺2
    冲刺1
    用户场景分析
    用户场景分析
    水王在哪
    课堂练习-4个数的和
    《大道至简》第一章读后感
    ELF Format 笔记(三)—— Section Types
  • 原文地址:https://www.cnblogs.com/ToFlying/p/3514978.html
Copyright © 2011-2022 走看看