ligerui：ligerTree：动态加载节点：

源码地址：http://download.csdn.net/detail/poiuy1991719/8571255

效果图：

代码：json.txt

[

    { text: '节点1', children: [

        { text: '节点1.1' },

        { text: '节点1.2' },

        { text: '节点1.3', children: [

                { text: '节点1.3.1' ,children: [

                    { text: '节点1.3.1.1' },

                    { text: '节点1.3.1.2' }]

                },

                { text: '节点1.3.2' }

        ]

        },

        { text: '节点1.4' }

        ]

    },

    { text: '节点2' },

    { text: '节点3' },

    { text: '节点4' }

]

代码：HTML

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<html>

<head>

<title>异步动态加载节点</title>

<!-- 1：引入文件 -->

<script src="lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>

<link href="lib/ligerUI/skins/Aqua/css/ligerui-tree.css"

    rel="stylesheet" type="text/css" />

<script src="lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>

<!-- 2：配置数据 -->

<script type="text/javascript">

    var manager = null;

    $(function() {

        $("#tree1").ligerTree({

            url : 'json.txt',

            onBeforeExpand : onBeforeExpand

        });

        //manager要在加载好ligerTree之后才获取

        manager=$("#tree1").ligerGetTreeManager();

    });

    //展开前激发事件

    function onBeforeExpand(note) {

        if (note.data.children && note.data.children.length == 0) {

            //这里模拟一个加载节点的方法，append方法也用loadData(target,url)代替

            manager.append(note.target, [{

                text : note.data.text + "child1"

            }, {

                text : note.data.text + "child2"

            }, {

                text : note.data.text + "child3"

            }]);

        }

    }

</script>

</head>

<body>

    JavaScript配置数据，的“树”效果

    <br>

    <div

        style="width:200px; height:500px; margin:10px; float:left; border:1px solid #ccc; overflow:auto;  ">

        <!-- 3：编写HTML代码 -->

        <ul id="tree1">

            <li isexpand="false"><span>第一个节点</span>

                <ul></ul></li>

            <li isexpand="false"><span>第二个节点</span>

                <ul></ul></li>

        </ul>

    </div>

    <div style="display:none"></div>

    <br>

    <a href="index.jsp">第一个效果：</a>

</body>

</html>

ligerui_ligerTree_007_ligerTree动态加载节点的更多相关文章

  1. 使用jsTree动态加载节点

    因为项目的需要,需要做一个树状菜单,并且节点是动态加载的,也就是只要点击父节点,就会加载该节点下的子节点. 大致的效果实现如下图: 以上的实现就是通过jsTree实现的,一个基于JQuery的树状菜单 ...

  2. dhtmlxtree动态加载节点数据的小随笔

    最近做了一个这个东西,颇有些感触,随笔记录一下自己的过程. 首先特别感谢:https://blog.csdn.net/cfl20121314/article/details/46852591,对我的帮 ...

  3. Easyui _treegrid 动态加载子节点

    <table id="dg" class="easyui-treegrid" title="数据字典列表" data-options= ...

  4. 记录Js动态加载页面.append、html、appendChild、repend添加元素节点不生效以及解决办法

    今天再优化blog页面的时候添加了个关注按钮和图片,但是页面上这个按钮和图片时有时无,本来是搞后端的,被这个前端的小问题搞得抓耳挠腮的! 网上各种查询解决方案,把我解决问题的艰辛历程分享出来,希望大家 ...

  5. （转）jQuery EasyUI Tree - TreeGrid动态加载子节点

    有时我们已经得到充分的分层树形网格(TreeGrid)的数据. 我们还想让树形网格(TreeGrid)按层次惰性加载节点. 首先,只加载顶层节点. 然后点击节点的展开图标来加载它的子节点. 本教程展示 ...

  6. 044. asp.net主题之三应用或禁用主题和动态加载主题

    1.为单个页面指定主题可以将@Page指令的Theme或StyleSheetTheme属性设置为要使用的主题名称, 代码如下: <%@ Page Theme ="MyTheme&quo ...

  7. highcharts 柱状图 动态加载

    highcharts柱状图动态加载 (1):导入样式 <script type="text/javascript" src="<%=request.getCo ...

  8. （转）高性能JavaScript：加载和运行（动态加载JS代码）

    浏览器是如何加载JS的 当浏览器遇到一个<script>标签时,浏览器首先根据标签src属性下载JavaScript代码,然后运行JavaScript代码,继而继续解析和翻译页面.如果需要 ...

  9. Dex动态加载

    Dex动态加载是为了解决什么问题? 在Android系统中,一个App的所有代码都在一个Dex文件里面. Dex是一个类似Jar的存储了多个Java编译字节码的归档文件. 因为Android系统使用D ...

随机推荐

  1. C语言中计算变量占用内存空间

    C语言中计算变量占用内存空间 在C语言中通常用[sizeof]运算符计算变量占内存空间,如下面的例子:

  2. Java_过滤字符串中非汉子的内容

    /** * 去除“第”之前的所有非汉字内容 */ private String clearNotChinese(String buff){ String tmpString =buff.replace ...

  3. 最新Velocity使用和Velocity语法

    Velocity语法 Velocity的使用要用到下面几个包,可以从官网下载,commons-collections.jar,velocity-1.4.jar,velocity-dept.jar; 1 ...

  4. Oracle 客户端免安装数据库连接

    PLSQL Developer 连接数据库需要安装Oracle客户端,在这里介绍一种Oracle客户端解压式安装,而不是exe安装. 安装步骤: 1:确定客户端安装所在主机的系统位数 2:选择正确的客 ...

  5. jquery插件之表格隔行变色并鼠标滑过高亮显示

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现表格隔行变色,且鼠标移动在表格的某一行上时,该行能高亮显示.整体代码如 ...

  6. 集合 ArrayList 类

    集合的基本信息: System.Collections   系统类中的收藏类,定义各种对象(如列表,队列,位数组,哈希表和字典)的集合 常用的集合为ArrayList类:特殊集合一般会用到Queue队 ...

  7. #1045 - Access denied for user 'root'@'localhost' (using password: NO)

    解决办法 打开 phpmyadmin里的config.inc.php文件 $cfg['Servers'][$i][ 'host'] = 'localhost';$cfg['Servers'][$i][ ...

  8. Jquery，YUI这个著名js库名称作用的理解

    看廖雪峰大神的教程,其中讲到变量作用域问题.在命名空间中,写到:因为全局变量绑到了window上,不同的js文件访问相同全局变量或者定义了相同名字的顶层函数,都会造成命名冲突,并且很难被发现. 减少冲 ...

  9. 数的长度---nyoj69

    超时 #include <stdio.h>#include <string.h>#define M 1000001int shu[M]; int main(){ int n, ...

  10. 手动给控制器添加xib

    UIViewController绑定xib界面可视化,有两种方式: 1.第一种(自动化),在创建控制器时,勾选xib选项. 2.第二种手动创建一个Xib,然后再手动绑定到对应的控制器上