jquery.treeview

第一步：装入所需文件

在HTML文档的标识里加入下面代码：
XML/HTML Code复制内容到剪贴板
 
<script type="text/javascript" src="jquery-1.4.2.min.js">script> 
 
 
<script type="text/javascript" src="TreeView/js/jQuery.tree.js">script> 
<link rel="stylesheet" type="text/css" href="TreeView/jQuery.tree.css"/> 
 
 
<script type="text/javascript" src="tree2.js">script> 
第二步：添加HTML代码

在HTML文档的标识里加入下面代码：
XML/HTML Code复制内容到剪贴板
<div id="tree">div> 
第三步：添加JavaScript代码

在HTML文档的标识里加入下面代码：
JavaScript Code复制内容到剪贴板
    var o = { 
        showcheck: true, 
        //url: "http://jscs.cloudapp.net/ControlsSample/GetChildData"; 
        animate:true, 
        cbiconpath: "lib/jquery/plugins/TreeView/images/icons/", //checkbox icon的目录位置 
        //icons: ["checkbox_0.gif", "checkbox_1.gif", "checkbox_2.gif"], 
        emptyiconpath:"lib/jquery/plugins/TreeView/images/s.gif", //checkbxo三态的图片 
        theme: "bbit-tree-lines", //bbit-tree-lines, bbit-tree-no-lines, bbit-tree-arrows 
        onnodeclick:function(item){alert(item.text);} 
    }; 
    o.data = treedata; 
    $("#tree").TreeView(o); 
}); 
插件配置参数
JavaScript Code复制内容到剪贴板
var dfop = 
            { 
                method: "POST", //默认采用POST提交数据 
                datatype: "json", //数据类型是json 
                url: false, //异步请求的url 
                cbiconpath: "images/icons/", //checkbox icon的目录位置 
                icons: ["checkbox_0.gif", "checkbox_1.gif", "checkbox_2.gif"], 
                emptyiconpath:"images/s.gif", //checkbxo三态的图片 
                showcheck: false, //是否显示checkbox 
                oncheckboxclick: false, //当checkstate状态变化时所触发的事件，但是不会触发因级联选择而引起的变化 
                onnodeclick: false, // 触发节点单击事件 
                cascadecheck: true, //是否启用级联，默认启用 
                data: null, //初始化数据 
                clicktoggle: true, //点击节点展开和收缩子节点 
                theme: "bbit-tree-arrows" //三种风格备选：bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows 
            }; 
节点数据格式（JSON）
JavaScript Code复制内容到剪贴板
data:[{ 
id:1, //ID只能包含英文数字下划线中划线 
text:"node 1", 
value:"1", 
showcheck:false, 
checkstate:0,         //0,1,2 
hasChildren:true, 
isexpand:false, 
complete:false, //是否已加载子节点 
ChildNodes:[] // child nodes 
}, 
.......... 
] 
几个方法
JavaScript Code复制内容到剪贴板
$("#tree").getTSVs()  //获取所有选中的节点的Value数组 
$("#tree").getTSNs()  //获取所有选中的节点的Item数组 
$("#tree").getTCT()   // 获取当前节点的Item数组 
$("#tree").reflash()  // 刷新节点数据