关于jquery中的zTree控件的使用

   今天有个项目要用到jquery里面的zTree，于是只得先学学这个以前没碰到过的家伙了。

  先上个图吧，zTree是这个样子滴(这是官方页面上的一个图)：

我们怎么用这个东东呢，第一步先下载，链接在这里：http://www.ztree.me/v3/demo.php#_101（这是3.5.14版本的，注意不同的版本使用的方式是不一样的）

然后我们把要用到的东西加到页面当中：

将js文件和css里面的zTreeStyle文件夹放到项目里，在web页面当中引用：

<script type="text/javascript" src="js_tree/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js_tree/jquery.ztree.all-3.5.js"></script>
<script type="text/javascript" src="js_tree/jquery.ztree.excheck-3.5.js"></script>
<script type="text/javascript" src="js_tree/jquery.ztree.exedit-3.5.js"></script>
<script type="text/javascript" src="js_tree/jquery.ztree.exhide-3.5.js"></script>
<link rel="stylesheet" type="text/css" href="zTreeStyle/zTreeStyle.css">

<ul id="tree" class="ztree"></ul>
<br/>

<script type="text/javascript">
    var zTree;
    var setting = {
        isSimpleData : true,              //数据是否采用简单 Array格式，默认false  
        treeNodeKey : "id",               //在isSimpleData格式下，当前节点id属性  
        treeNodeParentKey : "pId",        //在isSimpleData格式下，当前节点的父节点id属性  
        showLine : true,                  //是否显示节点间的连线  
        checkable : true                  //每个节点上是否显示 CheckBox  
    };
    var treeNodes = [
        {"name":"网站导航", open:false, children:[
            {"name":"google", "url":"result.html","target":"_blank"},
            {"name":"baidu", "url":"www.baidu.com","target":"_blank"}
            ]
        }
    ];
    
    $(function(){
        zTree =  $.fn.zTree.init($("#tree"), setting, treeNodes);
    });