struts2 jquery 打造无限层次的树


Posted in Javascript onOctober 23, 2009

<%-- tree.jsp --%>
<%@ page pageEncoding="gbk" contentType="text/html;charset=gbk" import="java.util.ArrayList" %>
<%@ taglib uri="/struts-tags" prefix="s" %>
<link rel="stylesheet" href="${myRoot }/jquery/jquery.treeview.css" />
<link rel="stylesheet" href="${myRoot }/jquery/screen.css" />
<script src="${myRoot }/jquery/jquery.js" type="text/javascript"></script>
<script src="${myRoot }/jquery/jquery.treeview.js" type="text/javascript"></script>
<%
//需要:Struts2 , jquery树插件,其下载地址为: http://xiazai.3water.com/200910/other/jquery.treeview.zip
//无限层次的树--作者 郴州拓职软件学院任文敏
//模拟数据库数据:每行数据包括--自己ID,自己内容,父亲ID
ArrayList ary = new ArrayList(); //所有数据
String[] ary1 = new String[]{"1","item1","0"}; //每行数据
ary.add(ary1);
ary1 = new String[]{"2","item2","0"};
ary.add(ary1);
ary1 = new String[]{"3","item3","0"};
ary.add(ary1);
ary1 = new String[]{"4","item1_1","1"};
ary.add(ary1);
ary1 = new String[]{"5","item1_2","1"};
ary.add(ary1);
ary1 = new String[]{"6","item1_2_1","5"};
ary.add(ary1);
ary1 = new String[]{"7","item1_2_2","5"};
ary.add(ary1);
ary1 = new String[]{"8","item2_1","2"};
ary.add(ary1);
ary1 = new String[]{"9","item2_1_1","8"};
ary.add(ary1);
ary1 = new String[]{"10","item2_2","2"};
ary.add(ary1);
ary1 = new String[]{"11","item3_1","3"};
ary.add(ary1);
ary1 = new String[]{"12","item3_2","3"};
ary.add(ary1);
request.setAttribute("datas",ary);
%>
<script type="text/javascript">
$(document).ready(function(){
var oAppend;
<s:iterator value="#request.datas" id="t">
if($("#ul${t[2]}").size()==0) { //如果父亲UL找不到,则创建父亲UL,并附加到父亲LI
oAppend = $("<ul id='ul${t[2]}'><li id='li${t[0]}'><input type='checkbox' value='ck${t[0]}' />${t[1]}</li></ul>").appendTo($("#li${t[2]}"));
}
else { //如果父亲UL找到了,则直接附加到父亲UL
oAppend = $("<li id='li${t[0]}'><input type='checkbox' value='ck${t[0]}' />${t[1]}</li>").appendTo("#ul${t[2]}");
}
</s:iterator>
$("#ul0").treeview({ //通过根节点容器展示整个树
});
});
</script>
<!-- 容纳根节点的UL,这里0是根节点的父亲节点 -->
<ul id="ul0"></ul>

jquery树插件,其下载地址为: http://xiazai.3water.com/200910/other/jquery.treeview.zip

Javascript 相关文章推荐
设为首页加入收藏兼容360/火狐/谷歌/IE等主流浏览器的代码
Mar 26 Javascript
点击进行复制的JS代码实例
Aug 23 Javascript
node.js中的http.request.end方法使用说明
Dec 10 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
Oct 26 Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
Oct 14 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
Nov 11 Javascript
Vue结合原生js实现自定义组件自动生成示例
Jan 21 Javascript
jQuery EasyUI Panel面板组件使用详解
Feb 28 Javascript
详解利用 Express 托管静态文件的方法
Sep 18 Javascript
浅析微信小程序modal弹窗关闭默认会执行cancel问题
Oct 14 Javascript
通过javascript实现扫雷游戏代码实例
Feb 09 Javascript
Vue 实现对quill-editor组件中的工具栏添加title
Aug 03 Javascript
jquery 插件开发方法小结
Oct 23 #Javascript
jquery 屏蔽一个区域内的所有元素,禁止输入
Oct 22 #Javascript
Domino中运用jQuery读取视图内容的方法
Oct 21 #Javascript
JavaScript 常用函数库详解
Oct 21 #Javascript
再谈ie和firefox下的document.all属性
Oct 21 #Javascript
javascript void(0)的妙用
Oct 21 #Javascript
extjs 学习笔记 四 带分页的grid
Oct 20 #Javascript
You might like
mysql 的 like 问题,超强毕杀记!!!
2007/01/18 PHP
PHP中开发XML应用程序之基础篇 添加节点 删除节点 查询节点 查询节
2010/07/09 PHP
php下删除一篇文章生成的多个静态页面
2010/08/08 PHP
PHP基础教程(php入门基础教程)一些code代码
2013/01/06 PHP
深入理解PHP中的Session和Cookie
2013/06/21 PHP
解析strtr函数的效率问题
2013/06/26 PHP
php cookie中点号(句号)自动转为下划线问题
2014/10/21 PHP
php获取访问者IP地址汇总
2015/04/24 PHP
Laravel实现构造函数自动依赖注入的方法
2016/03/16 PHP
php cli模式下获取参数的方法
2017/05/05 PHP
PHP htmlspecialchars() 函数实例代码及用法大全
2018/09/18 PHP
又一个小巧的图片预加载类
2007/05/05 Javascript
面向对象的编程思想在javascript中的运用上部
2009/11/20 Javascript
window.location.href中url中数据量太大时的解决方法
2013/12/23 Javascript
javascript实现表格排序 编辑 拖拽 缩放
2015/01/02 Javascript
为什么JavaScript没有块级作用域
2016/05/22 Javascript
基于jQuery解决ios10以上版本缩放问题
2017/11/03 jQuery
在 vue-cli v3.0 中使用 SCSS/SASS的方法
2018/06/14 Javascript
浅谈javascript错误处理
2019/08/11 Javascript
快速解决element的autofocus失效问题
2020/09/08 Javascript
vue+element table表格实现动态列筛选的示例代码
2021/01/14 Vue.js
在Keras中实现保存和加载权重及模型结构
2020/06/15 Python
Python同时处理多个异常的方法
2020/07/28 Python
Python爬虫自动化爬取b站实时弹幕实例方法
2021/01/26 Python
巴西家用小家电购物网站:Polishop
2016/08/07 全球购物
Java中有几种方法可以实现一个线程?用什么关键字修饰同步方法?stop()和suspend()方法为何不推荐使用?
2015/08/04 面试题
售后主管岗位职责
2013/12/08 职场文书
幼儿教师考核制度
2014/01/25 职场文书
中层干部培训方案
2014/06/16 职场文书
出租房屋协议书
2014/09/14 职场文书
2014镇党委班子对照检查材料思想汇报
2014/09/23 职场文书
2014年节能工作总结
2014/12/18 职场文书
新闻发布会新闻稿
2015/07/17 职场文书
十二月早安励志心语大全
2019/12/03 职场文书
浅谈react useEffect闭包的坑
2021/06/08 Javascript
一文搞懂Redis中String数据类型
2022/04/03 Redis