jquery treeview 树形插件

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，初始化为收缩节点状态；false，为全部节点展开。

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下载：http://bassistance.de/jquery-plugins/

html页引用和JS部分

"server">
    <%-- 文件引用部分，该部分都可从官方参考Demo中获得，其中cookie为上述参数“persist”服务来记录刷新前展示信息--%>
    "jquery.treeview.css" rel="stylesheet" type="text/css" />
    
    
    
    

Body结构

<ul id="tree1">
 <li>主节点内容
      <ul>
      <li>主节点的子节点1li>
      <li>主节点的子节点2
            <ul>
            <li>主节点的子节点2的子节点li>
            <li>主节点的子节点2的子节点li>
            <li>主节点的子节点2的子节点li>
            <li>主节点的子节点2的子节点li>
            ul>
      li>
      <li>主节点的子节点3li>
      <li>主节点的子节点4li>
      ul>
li>
ul>    

加载节点时如果数据量很大，可先加载主节点，子节点通过参数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);
        %>

 

 

转载于:https://www.cnblogs.com/akingyao/archive/2013/01/16/2862553.html