zoukankan      html  css  js  c++  java
  • easyuI企业管理系统-实战六 导航一

    今天你学习了吗?本篇讲述了导航如何生成
    //系统时间显示
    setInterval("document.getElementById('nowTime').innerHTML=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());",1000);
    var setting = {
        data: {
            simpleData: {
                enable: true
            }
        },
        view: {
            selectedMulti: false
        },
        callback: {
            onClick:function(e, id, node){
                var zTree = $.fn.zTree.getZTreeObj("menuTree");
                if(node.isParent) {
                    zTree.expandNode();
                } else {
                    addTabs(node.name, node.file);
                }
            }
        }
    };
    
    var zNodes =[//导航的关键代码
        { id:1, pId:0, name:"用户管理", open:false},
        { id:11, pId:1, name:"用户列表", file:"../User/user_retrieve1"}, 
        { id:2, pId:0, name:"权限管理", open:true},
        { id:21, pId:2, name:"权限列表", file:"../Role/role_retrieve1"}
        ];
     
    $(function() {
        $.fn.zTree.init($("#menuTree"), setting, zNodes);
        var zTree = $.fn.zTree.getZTreeObj("menuTree"); 
        //中间部分tab
        $('#tabs').tabs({  
            border:false,
            fit:true,
            onSelect: function(title, index){
                var treeNode = zTree.getNodeByParam("name", title, null);
                zTree.selectNode(treeNode);
            }
        }); 
        
        $('.index_panel').panel({  
          300,  
          height:200,  
          closable:true,
          minimizable:true,
          title: 'My Panel'
        });
        
    });
    
    //添加一个选项卡面板 
    function addTabs(title, url, icon){
    
        if(!$('#tabs').tabs('exists', title)){
            $('#tabs').tabs('add',{  
                title:title,  
                content:'<iframe src="'+url+'" frameBorder="0" border="0" scrolling="no" style=" 100%; height: 100%;"/>',  
                closable:true
            });
        } else {
            $('#tabs').tabs('select', title);
        }
    }
    
  • 相关阅读:
    delegate和event的区别 (zz)
    delegate和event的区别 (zz)
    delegate和event的区别 (zz)
    delegate和event的区别 (zz)
    以太坊网络服务分析
    以太坊:P2P网络数据处理流程
    以太坊:P2P网络数据交互
    以太坊虚拟机的基本介绍
    Solidity概述及基本代码展示
    Solidity编译器和简单调试
  • 原文地址:https://www.cnblogs.com/maojiayan/p/4892371.html
Copyright © 2011-2022 走看看