1. 动态添加ligerTree节点：
    效果图：

  1.  
  1. 源码地址：http://download.csdn.net/detail/poiuy1991719/8571255
  1. <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
  2. <html>
  3. <head>
  4. <title>动态增加“树”节点</title>
  5. <!-- 1：引入文件 -->
  6. <script src="lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
  7. <link href="lib/ligerUI/skins/Aqua/css/ligerui-tree.css"
  8.     rel="stylesheet" type="text/css" />
  9. <script src="lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>
  10. <!-- 2：配置数据 -->
  11. <script type="text/javascript">
  12.     var manager = null;
  13.  
  14.     $(function() {
  15.         //显示图标
  16.         $("#.l-tree").ligerTree({
  17.             checkbox : true
  18.         });
  19.         manager = $("#.l-tree").ligerGetTreeManager();
  20.     });
  21.  
  22.     //添加节点
  23.     function addTreeItem() {
  24.         var node = manager.getSelected();//获取当前指定的节点
  25.         var nodes = [];
  26.         nodes.push({
  27.             text : $("#txtNode").val()
  28.         });
  29.         if (node) {//如果选择了节点，就添加节点
  30.             manager.append(node.target, nodes);
  31.         } else {
  32.             manager.append(null, nodes);
  33.         }
  34.     }
  35.     //添加多个节点
  36.     function addTreeItems(){
  37.         var node = manager.getSelected();
  38.         var nodes=[];
  39.         nodes.push({text:$("#txtNode").val(),
  40.             children:[{text:'子1'},{text:'子2'}]
  41.         });
  42.         if(node){
  43.             manager.append(node.target,nodes);
  44.         }else{
  45.             manager.append(null,nodes);
  46.         }
  47.     }
  48.  
  49.     //删除节点
  50.     function removeTreeItem() {
  51.         var node = manager.getSelected();
  52.         if (node) {
  53.             manager.remove(node.target);
  54.         } else {
  55.             alert('请先选择节点');
  56.         }
  57.     }
  58.  
  59.     //清空节点
  60.     function clearTreeItem() {
  61.         manager.clear();
  62.     }
  63. </script>
  64. </head>
  65. <body>
  66.  
  67.     带复选框和图标，动态添加、删除、清空节点
  68.     <br>
  69.  
  70.     <input type="text" class="l-text" value="节点名" id="txtNode"
  71.         style="display:block; float:left; margin-right:10px;" />
  72.  
  73.     <a class="l-button" onclick="addTreeItem()"
  74.         style="float:left;margin-right:10px;">增加节点</a>
  75.  
  76.     <a class="l-button" onclick="removeTreeItem()"
  77.         style="float:left;margin-right:10px;">删除节点</a>
  78.  
  79.     <a class="l-button" onclick="clearTreeItem()"
  80.         style="float:left;margin-right:10px;">清空节点</a>
  81.  
  82.     <a class="l-button" onclick="addTreeItems()"
  83.         style="width:150px;float:left;margin-right:10px;">增加节点(带子节点)</a>
  84.     <br>
  85.  
  86.     <!-- 2：编写HTML -->
  87.     <div
  88.         style="width:200px; height:300px; border:1px solid #ccc; overflow:auto; clear:both;">
  89.         <ul class="l-tree">
  90.             <li><span>节点1</span>
  91.                 <ul>
  92.                     <li><span>节点1.1</span>
  93.                         <ul>
  94.                             <li><span>节点1.1.1</span></li>
  95.                             <li><span>节点1.1.2</span></li>
  96.                         </ul></li>
  97.                     <li><span>节点1.2</span></li>
  98.                 </ul></li>
  99.  
  100.             <li><span>节点2</span></li>
  101.  
  102.             <li isexpand="false"><span>节点3</span>
  103.                 <ul>
  104.                     <li><span>节点3.1</span></li>
  105.                     <li><span>节点3.2</span></li>
  106.                 </ul></li>
  107.         </ul>
  108.     </div>
  109.     <div style="display:none"></div>
  110.     <a href="index6.jsp">下一效果：</a>
  111. </body>
  112. </html>

ligerui_ligerTree_005_动态增加“树”节点的更多相关文章

  1. Hadoop概念学习系列之Hadoop集群动态增加新节点或删除已有某节点及复制策略导向 （四十三）

    不多说,直接上干货! hadoop-2.6.0动态添加新节点 https://blog.csdn.net/baidu_25820069/article/details/52225216 Hadoop集 ...

  2. hdfs以及hbase动态增加和删除节点

    一个知乎上的问题:Hbase的Region server和hadoop的datanode是否可以部署在一台服务器上?如果是的话,二者是否是一对一的关系?部署在同一台服务器上,可以减少数据跨网络传输的流 ...

  3. Hadoop 2.6.3动态增加/删除DataNode节点

    假设集群操作系统均为:CentOS 6.7 x64 Hadoop版本为:2.6.3 一.动态增加DataNode 1.准备新的DataNode节点机器,配置SSH互信,可以直接复制已有DataNode ...

  4. JS动态增加删除UL节点LI

    JS如何动态增加删除UL节点LI及相关内容. <ul id="ul"> <li id=1>11111111111111111<a href=" ...

  5. Hyperledger fablic 1.0 在centos7环境下的安装与部署和动态增加节点

    Hyperledger fablic 1.0 在centos7环境下的安装与部署和动态增加节点 一.安装docker 执行代码如下: curl -sSL https://get.daocloud.io ...

  6. ZooKeeper动态增加Server（动态增加节点）的研究（待实践）

    说明:是动态增加Server,不是动态增加连接到ZK Server的Client. 场景如下(转自外文): 1.在t=t_1->[peer-1(Leader),peer-2],peer-1是主节 ...

  7. Hadoop动态增加节点与删除节点

    Hadoop的全分布式安装网上也很多教程,踩过很多坑,整理不出来了……赶紧把增加删除节点留住. 均衡数据 (1)设置数据传输带宽为64M(默认值比较低) hdfs dfsadmin -setBalan ...

  8. JPA，EclipseLink 缓存机制学习(一) 树节点搜索问题引发的思考

    最近在项目在使用JPA+EclipseLink 的方式进行开发,其中EclipseLink使用版本为2.5.1.遇到一些缓存方面使用不当造成的问题,从本篇开始逐步学习EclipseLink的缓存机制. ...

  9. ligerui_ligerTree_007_ligerTree动态加载节点

    ligerui:ligerTree:动态加载节点: 源码地址:http://download.csdn.net/detail/poiuy1991719/8571255 效果图: 代码:json.txt ...

随机推荐

  1. weblogic部署项目包，报空指针错误

    贴出 报错代码 <weblogic> <> <> <1479765377228> <BEA-240003> <Console enco ...

  2. javascrit2.0完全参考手册(第二版) 第2章第2节 语言特性

    脚本执行顺序     js代码是按照它们在html中出现的顺序一行一行被解释的.这表明把函数定义和变量声明放到<head>中会很好.这保证了函数的代码和事件相关的处理程序不会立即执行. 大 ...

  3. 制作、解析带logo的二维码

    用DecoderQRCode来解析带logo的二维码,发现报错,解析不了,于是便又查资料,找到了更强大的制作二维码 工具:GooleZXing 首先下GooleZXing的jar包. -------- ...

  4. 【BUG】wego购物分享系统未登陆分享宝贝时查看宝贝自动新增产品数据

    1.登录微购http://demo.wego360.com/站. 2.分享宝贝功能检索第三方平台商品数据. 1.登录微购http://demo.wego360.com/站. 2.分享宝贝功能检索第三方 ...

  5. signal(SIGPIPE, SIG_IGN)

    文章来源:http://blog.163.com/niuxiangshan@126/blog/static/170596595201221942952676/   当服务器close一个连接时,若cl ...

  6. uploadify 自动访问url 初始化 自动请求

    摘要: uploadify 自动请求url, 初始化时自动请求url解决方法. 项目中使用了uploadify 上传图片,当访问到上传页面url,uploadify初始化时再一次访问该url 当我在配 ...

  7. [LintCode] Happy Number 快乐数

    Write an algorithm to determine if a number is happy. A happy number is a number defined by the foll ...

  8. HDU3177 贪心

    Crixalis's Equipment Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...

  9. windows用户用VMware 虚拟机安装黑苹果Mac.OS.X操作系统

    使用的操作系统操作系统 windows7 SP1 X64 本教程所用 的软件的下载地址都在本教程中 ) 电脑内存低于 4G 的,加内存吧 … 1. SecurAble (检测你的 CPU 是否支持硬件 ...

  10. 【HDU1914 The Stable Marriage Problem】稳定婚姻问题

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1914 题目大意:问题大概是这样:有一个社团里有n个女生和n个男生,每位女生按照她的偏爱程度将男生排序, ...