zoukankan      html  css  js  c++  java
  • zTree学习

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <!DOCTYPE html>
    <HTML>
    <HEAD>
        <TITLE> ZTREE DEMO </TITLE>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <link rel="stylesheet" href="zTreeStyle/zTreeStyle.css" type="text/css">
      <script type="text/javascript" src="jquery-1.9.1.js"></script>
      <script type="text/javascript" src="jquery.ztree.core-3.5.js"></script>
        <SCRIPT LANGUAGE="JavaScript">
            var zTreeObj;
            var setting = {};    
      var zNodes = [
        {name: "父节点",open:true, children: [
            {name: "子节点1"},
            {name: "子节点2"}
        ]}
    ];
            $(document).ready(function () {
                zTreeObj = $.fn.zTree.init($("#tree"), setting, zNodes); 
            });
        </SCRIPT>
    </HEAD>
    <BODY>
        <div>
            <ul id="tree" class="ztree"></ul> 
        </div>
    </BODY>
    </HTML>

    使用zTree需要首先加载 jquery-1.4.2.js 或其他更高版本的 jQuery 。需要加载 jquery-ztree.core-3.0.js,如果需要用到 编辑功能 或 checkbox / radio 还需要分别加载 jquery-ztree.exedit-3.0.js 和 jquery-ztree.excheck-3.0.js 。需要加载 zTreeStyle.css 以及 zTreeStyle 目录下的 img 文件。

    zTreeObj:定义Tree容器

    setting:zTree 的配置数据

    zNodes:数据源(json格式)

    open:默认是false,可以更改true,展开树

     zTreeObj = $.fn.zTree.init($("#tree"), setting, zNodes); :初始化ztree

    这个人不懒,写了一点东西
  • 相关阅读:
    java设计模式----迭代器模式和组合模式
    Redis实现消息的发布/订阅
    java设计模式----模板方法模式
    java设计模式----适配器模式
    Filter注入对象
    java设计模式----命令模式
    css3中animation的应用
    bootstrap的学习注意点
    关于animate的一些属性
    ie的兼容方法,条件注释的方法
  • 原文地址:https://www.cnblogs.com/AnonymouL/p/5717660.html
Copyright © 2011-2022 走看看