jquery treeview 插件参数说明

treeview地址：https://github.com/jzaefferer/jquery-treeview

1、animated：String or Number

设置展开子节点时的显示速度，有 slow、normal、fast 或者指定速度值，与 jQuery 的 hide（show）中的 speed 参数相似。

这里有个问题,如果使用动态的效果,这时候给人一闪一闪的感觉,如果不喜欢可以不使用这个属性就可以,这样就没有那种一闪一闪的感觉了

 

2、persist：String

记忆折叠的方式。location：页面刷新不保留折叠状态；cookie：页面刷新保留折叠状态。

3、collapsed：boolean　　Default: false, all expanded

初始化时的折叠状态。true，初始化为收缩节点状态；，为全部节点展开。

4、unique：boolean　　Default: false

展开同级节点的唯一性。true，当展开一个节点时，同级的其他节点会自动关闭；false，当展开一个节点时，同级的其他节点保持原形。

5、control：Selector

指定一个容器,控制整个tree的展开,收缩 或者收放 所有的节点。

example

$(".selector").treeview({   control: "#container"})

6.toggle：Callback

当一个节点的收放状态改变时，调用自定义函数Callback。

example

$(".selector").treeview({   toggle: function() {       console.log(this + " has been toggle");   }})

7.add：Selector

向已有的树中追加节点，selector 为需要追加的节点集合，该集合中的节点须与已有树的节点结构保持一致。

example

var tree = $(".selector").treeview();$(".button").click(function() {  var newSublist =  $("
New Sublist
      
       " +     "
       
Item1
" +     "
       
Item2
      
").appendTo(tree);  tree.treeview({    add: newSublist  });});

8.cookieId：String

设置 persist: cookie 后 用此参数设置cookie 的名称。

9.url：String

异步加载时，设置url 地址。

下面就来看看如何的实用

官方参考网站包涵Demo下载：

html页引用和JS部分

    <%-- 文件引用部分，该部分都可从官方参考Demo中获得，其中cookie为上述参数“persist”服务来记录刷新前展示信息--%>    
                      

 

Body结构

      
            
       
Item 1                
        
                    
         
Item 1.0                        
          
                            
           
Item 1.0.0
                        
          
                    
                    
         
Item 1.1
                    
         
Item 1.2                        
          
                            
           
Item 1.2.0 
            
 
             
Item 1.2.0.0
 
             
Item 1.2.0.1
 
             
Item 1.2.0.2
 
            
 
                            
           
Item 1.2.1 
            
 
             
Item 1.2.1.0
 
            
 
                            
           
Item 1.2.2 
            
 
             
Item 1.2.2.0
 
             
Item 1.2.2.1
 
             
Item 1.2.2.2
 
            
 
                        
          
                    
                
        
            
            
       
Item 2                
        
                    
         
Item 2.0                        
          
                            
           
Item 2.0.0 
            
 
             
Item 2.0.0.0
 
             
Item 2.0.0.1
 
            
 
                        
          
                    
                    
         
Item 2.1                        
          
                            
           
Item 2.1.0 
            
 
             
Item 2.1.0.0
 
            
 
                            
           
Item 2.1.1 
            
 
             
Item 2.1.1.0
 
             
Item 2.1.1.1
 
             
Item 2.1.1.2
 
            
 
                            
           
Item 2.1.2 
            
 
             
Item 2.1.2.0
 
             
Item 2.1.2.1
 
             
Item 2.1.2.2
 
            
 
                        
          
                    
                
        
            
            
       
Item 3                
        
                    
         
Item 3.0                        
          
                            
           
Item 3.0.0
                            
           
Item 3.0.1 
            
 
             
Item 3.0.1.0
 
             
Item 3.0.1.1
 
            
 
                            
           
Item 3.0.2 
            
 
             
Item 3.0.2.0
 
             
Item 3.0.2.1
 
             
Item 3.0.2.2
 
            
 
                        
          
                    
                
        
            
        
      

 

加载节点时如果数据量很大，可先加载主节点，子节点通过参数toggle来异步加载

由treeview树的规律，我们可以从数据库中来加载所需要的树

<%            DALZzjg dal = new DALZzjg();            DALYhxx ydal = new DALYhxx();            List
      
        lists = new List
       
        ();            lists = dal.FindWhere(" zzjg_npcode='10' ");            string str = "
        
         ";            str += "
         
Home";            if (lists.Count > 0)            {                str += "
          
           ";                foreach (Xtgl_Zzjg c in lists)                {                    str += "
           
" + c.Zzjg_Nmc + "" + c.Zzjg_Ncode + ""; DALUserAndDep yydal = new DALUserAndDep(); List
            
              listschild = new List
             
              (); listschild = yydal.FindWhere(" zzjg_ncode='" + c.Zzjg_Ncode + "' order by px "); if (listschild.Count > 0) { str += "
              
               "; foreach (View_UserandDep p in listschild) { // str += "
               
" + p.Yhxx_Nname + "
"; } str += "
              
"; } str += "
             
            
";                }                str += "
          
";            }            str += "
        
";            Response.Write(str);        %>