程序博客网 > java 泛型编程 pdf

jquery treeview 简介

来源：互联网 发布：java 泛型编程 pdf 编辑：程序博客网 时间：2024/06/15 06:39

【声明】

内容源自网络。

1.静态


[html] view plain copy
  1. <html>  
  2. <head>  
  3.     <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />  
  4.     <title>tree demo</title>  
  5.     <link rel="stylesheet" href="./jquery.treeview.css" />  
  6.     <!-- <link rel="stylesheet" href="./css/screen.css" /> -->  
  7.     <script type="text/javascript" src="./js/jquery-1.7.2.js"></script>  
  8.     <script type="text/javascript" src="./js/jquery.treeview.js"></script>  
  9.     <script type="text/javascript">  
  10. $(function(){  
  11.     $("#browser").treeview();  
  12. })  
  13. </script>  
  14.       
  15. </head>  
  16. <body>  
  17. <h4>Sample Tree - default</h4>  
  18. <ul id="browser" class="filetree">  
  19.     <li>  
  20.         <span class="folder">Folder 1</span>  
  21.         <ul>  
  22.             <li><span class="file">Item 1.1</span></li>  
  23.         </ul>  
  24.     </li>  
  25.       
  26.     <li>  
  27.         <span class="folder">Folder 2</span>  
  28.         <ul>  
  29.             <li><span class="folder">Subfolder 2.1</span>  
  30.                 <ul id="folder21">  
  31.                     <li><span class="file">File 2.1.1</span></li>  
  32.                     <li><span class="file">File 2.1.2</span></li>  
  33.                 </ul>  
  34.             </li>  
  35.             <li><span class="file">File 2.2</span></li>  
  36.         </ul>  
  37.     </li>  
  38.       
  39.     <li class="closed">  
  40.         <span class="folder">Folder 3 (closed at start)</span>  
  41.         <ul>  
  42.             <li><span class="file">File 3.1</span></li>  
  43.         </ul>  
  44.     </li>  
  45.       
  46.     <li><span class="file">File 4</span></li>  
  47. </ul>  
  48. </body>  
  49. </html>  


2.动态

官网

http://docs.jquery.com/Plugins/Treeview
http://bassistance.de/jquery-plugins/jquery-plugin-treeview/

①前端jsp

[html] view plain copy
  1. <%@page contentType="text/html; charset=utf-8" %>  
  2. <%  
  3.     String basePath = request.getContextPath();  
  4. %>  
  5. <html>  
  6. <head>  
  7.     <title>dynamic Demo</title>  
  8.     <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />  
  9.     <link rel="stylesheet" href="<%=basePath%>/jquery.treeview.css" />  
  10.     <script type="text/javascript" src="<%=basePath%>/js/jquery-1.7.2.js"></script>  
  11.     <script type="text/javascript" src="<%=basePath%>/js/jquery.cookie.js"></script>  
  12.     <script type="text/javascript" src="<%=basePath%>/js/jquery.treeview.js"></script>  
  13.     <script type="text/javascript" src="<%=basePath%>/js/jquery.treeview.async.js"></script>  
  14.       
  15. <script type="text/javascript">  
  16. function initTrees(){  
  17.     $("#tree").treeview({  
  18.             url:"<%=basePath%>/dynamicTree",  
  19.             ajax:{  
  20.                 data:{  
  21.                     "additional":function(){  
  22.                         return "yeah: " + new Date;  
  23.                     }  
  24.                 },  
  25.                 type: "post"  
  26.             }  
  27.             });  
  28. }  
  29.   
  30. $(function(){  
  31.     initTrees();  
  32. });  
  33. </script>  
  34.   
  35. </head>  
  36. <body>  
  37. <ul id="tree">  
  38. </ul>  
  39. </body>  
  40. </html>  

②后端servelet

[java] view plain copy
  1. protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  2.     // TODO Auto-generated method stub  
  3.     doPost(request, response);  
  4. }  
  5.   
  6. protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {  
  7.     // TODO Auto-generated method stub  
  8.     response.setHeader("Cache-Control", "no-cache");   
  9.     response.setContentType("text/json;charset=UTF-8");  
  10. //      response.setContentType("text/plain");  
  11.     response.setCharacterEncoding("utf-8");  
  12.     PrintWriter out = response.getWriter();  
  13.       
  14.     String re = "[{'text':'root','expanded':false,"  
  15.             + "'children':[{'text':'系统管理',"  
  16.             + "'children':[{'text':'用户管理'}, {'text':'权限管理'}]},{'text':'业务管理'}]}]";  
  17.       
  18.       
  19.     out.flush();  
  20.     System.out.println(re);  
  21.     out.write(re);  
  22.     out.close();  
  23. }  

效果图


【总结】

感觉jquery 树插件 treeview 也不是太好用！

阅读全文
0 0
java 泛型编程 pdf java 泛型编程 pdf
原创粉丝点击
热门IT博客
hololens 用mac开发hololens 用mac开发
微信公众平台域名微信公众平台域名
软件测试技能
apache ant maven
在线培训系统 源码
神原秀夫设计师知乎
娇兰花草水语玫瑰知乎
c语言教学视频百度网盘
淘宝拍照模特视频
json遍历解析
网易邮箱 数据库下载
安卓导航栏源码
知乎live错过了怎么办
淘宝买防静电鞋
数据应用层协议有哪些
gta捏脸数据女
missa队内关系知乎
2010年nba总决赛 知乎
协议数据单元组成
电脑故障检测软件
热门问题 老师的惩罚 人脸识别 我在镇武司摸鱼那些年 重生之率土为王 我在大康的咸鱼生活 盘龙之生命进化 天生仙种 凡人之先天五行 春回大明朝 姑娘不必设防，我是瞎子 蒙蒙夜雨 雾蒙蒙 雾气蒙蒙 细雨蒙蒙 蒙蒙细雨类似词语 蒙蒙细雨造句 蒙蒙细雨的意思 蒙蒙细雨意思 烟雨蒙蒙歌曲 蒙蒙细雨拼音 蒙蒙细雨的拼音 春雨蒙蒙地下 雷隐隐雾蒙蒙 烟雨蒙蒙歌词 烟雨蒙蒙原著结局好惨 耳朵蒙蒙的跟堵住什么 细雨蒙蒙类似词语 眼睛突然看东西雾蒙蒙 周小花现形记 angele蒙蒙 蒙袂辑履 蒙西拉米 蒙西 泰国王妃蒙西米拉裸爬 蒙西铁路线路图 蒙西多诺曼高级中学 蒙西拉米去世 卡蒙西尔厨房电器 阿荣旗蒙西水泥厂 蒙西华中铁路股份有限公司 蒙语 蒙语我爱你 我爱你蒙语 蒙语歌曲 蒙语你好 蒙语转换器 学蒙语入门 酒歌蒙语版 蒙语字母歌 蒙语歌软件 学蒙语的app 蒙语日常用语2000句

程序博客网，程序员的互联网技术博客家园。csdn论坛精品 msdn技术资料都在这里