youshini
youshini

Ext.tree.TreePanel

转载：http://blog.csdn.net/tinyyys/archive/2009/03/2**027142.aspx

个人只是进行了测试，理解而已。原文中使用的数据库是SQL 2000的，而本人使用的是mysql，故做了一点点的更改。

 【注意】：以下所有引用资源的路径都是根据自己的资源位置来配置的。

第一步：创建treePanel.html 

Code:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  5. <title>测试Ext.tree.TreePanel</title>  
  6. <link rel="stylesheet" type="text/css" href="../static/lib/ext/resources/css/ext-all.css" />  
  7. <script type="text/javascript" src="../static/lib/ext/adapter/ext/ext-base.js"></script>  
  8. <script type="text/javascript" src="../static/lib/ext/ext-all.js"></script>  
  9. <link rel="stylesheet" type="text/css" href="../style/comment.css" />  
  10. <script type="text/javascript" src="../js/treePanel.js" charset="utf-8"></script>  
  11. <link rel="shortcut icon" href="x.ico" />  
  12. </head>  
  13. <body>  
  14.   <div id="tree-panel" style="overflow:auto; height:600px;width:200px;border:2px solid #c3daf9;"></div>  
  15. </body>  
  16. </html>  

第二步：创建含Ext.onRready函数的treePanel.js文件

Code:
  1. Ext.onReady(function(){  
  2.     Ext.QuickTips.init();// 浮动信息提示  
  3.     Ext.BLANK_IMAGE_URL = '../static/lib/ext/resources/images/default/s.gif';// 替换图片文件地址为本地  
  4.      
  5.     // 创建一个简写  
  6.     var _Tree = Ext.tree;  
  7.     // 定义根节点的Loader  
  8.     var _treeloader = new _Tree.TreeLoader({  
  9.             // dataUrl : 'tree.jsp'//这里可以不需要指定URL，在加载前事件响应里面设置  
  10.             });  
  11.     // 添加一个树形面板  
  12.     var _treepanel = new _Tree.TreePanel({  
  13.         // renderTo:"tree_div",//如果使用renderTo，则不能使用setRootNode()方法，需要在TreePanel中设置root属性。  
  14.         el : 'tree-panel',// 将树形添加到一个指定的div中,非常重要！  
  15.         region : 'west',  
  16.         title : '功能菜单',  
  17.         width : 200,//面板宽度  
  18.         minSize : 180,  
  19.         maxSize : 250,  
  20.         split : true,  
  21.         autoHeight : false,  
  22.         frame : true,// 美化界面  
  23.         // title : '可编辑和拖动的异步树',//标题  
  24.         // autoScroll : true, // 自动滚动  
  25.         enableDD : true,// 是否支持拖拽效果  
  26.         containerScroll : true,// 是否支持滚动条  
  27.         rootVisible : true, // 是否隐藏根节点,很多情况下，我们选择隐藏根节点增加美观性  
  28.         border : true, // 边框  
  29.         animate : true, // 动画效果  
  30.         loader : _treeloader // 树加载  
  31.         });  
  32.           
  33.         // 异步加载根节点  
  34.        var _rootnode = new _Tree.AsyncTreeNode({  
  35.                 id : '0',  
  36.                 text : '家电品牌总类',  
  37.                 draggable : false,// 根节点不容许拖动  
  38.                 expanded : true  
  39.             });  
  40.       // 为tree设置根节点  
  41.       _treepanel.setRootNode(_rootnode);  
  42.         
  43.       // 响应加载前事件，传递node参数  
  44.      _treepanel.on('beforeload', function(node) {  
  45.            _treepanel.loader.dataUrl = 'tree.jsp?parentId=' + node.id; // 定义子节点的Loader  
  46.          });  
  47.   
  48.     // 渲染树形  
  49.     _treepanel.render();  
  50.     // 展开节点,第一个参数表示是否级联展开子节点  
  51.     _rootnode.expand(false);  
  52.       
  53.     // 设置树的点击事件   【测试点击事件不影响  树的其他效果】  
  54.     var _treeClick=function (node, e) {   //contentPanel 为定义的TabPanel  
  55.         if (node.isLeaf()) {  
  56.             e.stopEvent();  
  57.             var n = contentPanel.getComponent(node.id); //通过node的id 获取组件  
  58.             if (!n) {                                  //如果不存在   则new 一个出来  
  59.                 var n = contentPanel.add({  
  60.                             'id' : node.id,  
  61.                             'title' : node.text,  
  62.                             closable : true,  
  63.                             autoLoad : {  
  64.                                 url : 'tabFrame.jsp?url=grid.html',  
  65.                                 scripts : true  
  66.                             } // 通过autoLoad属性载入目标页,如果要用到脚本,必须加上scripts属性  
  67.                         });  
  68.             }  
  69.             contentPanel.setActiveTab(n);  
  70.         }  
  71.     }  
  72.       
  73.     // 增加鼠标单击事件  
  74.     _treepanel.on('click', _treeClick);  
  75.   
  76.    
  77.   
  78.     // 定义右键菜单  
  79.     var rightClick = new Ext.menu.Menu({  
  80.                 id : 'rightClickCont',  
  81.                 items : [{  
  82.                             id : 'rMenu1',  
  83.                             text : '添加节点',  
  84.                             // 增加菜单点击事件  
  85.                             handler : function() {  
  86.                                 alert('添加节点的实现！');  
  87.                             }  
  88.                         }, {  
  89.                             id : 'rMenu2',  
  90.                             text : '编辑节点'  
  91.                         }, {  
  92.                             id : 'rMenu3',  
  93.                             text : '删除节点'  
  94.                         }]  
  95.             });  
  96.     // 增加右键点击事件  
  97.     _treepanel.on('contextmenu', function(node, event) {// 声明菜单类型  
  98.                 event.preventDefault();// 阻止浏览器默认右键菜单显示  
  99.                 rightClick.showAt(event.getXY());// 取得鼠标点击坐标，展示菜单  
  100.        });  
  101.       
  102.         /* 
  103.      * 设置tree的节点放置函数此函数有一个很重要的参数对象e e对象有三个重要的属性，分别为dropNode,target,point 
  104.      * 1.dropNode为在拖动时鼠标抓住的节点 2.target为将要放置在某处的节点 
  105.      * 3.point为被放置的状态，分别有append表示添加，above节点的上方，below节点的下方。 
  106.      * 
  107.      */  
  108.   
  109.     _treepanel.on('nodedrop', function(e) {  
  110.                 if (e.point == 'append') {  
  111.                     alert('当前"' + e.dropNode.text + '"划到"' + e.target.text+ '"里面！');  
  112.                 } else if (e.point == 'above') {  
  113.                     alert('当前"' + e.dropNode.text + '"放在了"' + e.target.text + '"上面！');  
  114.                 } else if (e.point == 'below') {  
  115.                     alert('当前"' + e.dropNode.text + '"放在了"' + e.target.text + '"下面！');  
  116.                 }  
  117.             });  
  118.   
  119.     // 在原有的树形添加一个TreeEditor  
  120.     var _treeEditer = new _Tree.TreeEditor(_treepanel, {  
  121.                 allowBlank : false  
  122.             });  
  123.   
  124.     /* 
  125.      * 为创建的treeEditer添加事件 有两个事件最为常用，一个为beforestartedit另一个为complete 
  126.      * 从名字就可以看出，beforestartedit事件是在编辑前的事件，因此可以通过它来判断那些节点可以编辑那些不可以。 
  127.      * complete为编辑之后的事件，在这里面可以添加很多事件，比如添加一个Ext.Ajax向后台传送修改的值等等。 
  128.      */  
  129.   
  130.     _treeEditer.on("beforestartedit", function(_treeEditer) {  
  131.                 var _tempNode = _treeEditer.editNode;// 将要编辑的节点  
  132.                 if (_tempNode.isLeaf()) {// 这里设定叶子节点才容许编辑  
  133.                     return true;  
  134.                 } else {  
  135.                     return false;  
  136.                 }  
  137.             });  
  138.   
  139.     _treeEditer.on("complete", function(_treeEditer) {  
  140.                 Ext.Msg.alert("被修改为" + _treeEditer.editNode.text);  
  141.             });  
  142.          
  143.     // （1）通过TabPanel控件的html属性配合<iframe>实现。该方法是利用  
  144.     // html属性中包含<iframe>的语法来调用另一个页面，具体见代码。  
  145.     // （2）通过TabPanel控件的autoLoad属性实现。该方法是利用autoLoad属性，它有很多参数，  
  146.     // 其中有两个比较重要，url表示要载入的文件，scripts表示载入的文件是否含有脚本，该属性相当重要，  
  147.     // 如果在新的页面中要创建Ext控件，必须指定该参数。该方法实现较前一个复杂，因为引入的文件不是一个完整的html文件，  
  148.     // 有可能只是内容的一部分，但是资源占用较少，而且载入速度较快（它有一个载入指示）  
  149.   
  150.     // 添加第一个节点(html)  
  151.     _treepanel.root.appendChild(new Ext.tree.TreeNode({  
  152.         id : 'htmlPanel',  
  153.         text : '通过html打开',  
  154.         listeners : {  
  155.             'click' : function(node, event) {  
  156.                 event.stopEvent();  
  157.                 var n = contentPanel.getComponent(node.id);  
  158.                 if (!n) { // 判断是否已经打开该面板  
  159.                     n = contentPanel.add({  
  160.                         'id' : node.id,  
  161.                         'title' : node.text,  
  162.                         closable : true, // 通过html载入目标页  
  163.                         html : '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="grid.html"></iframe>'  
  164.                     });  
  165.                 }  
  166.                 contentPanel.setActiveTab(n);  
  167.             }  
  168.         }  
  169.   
  170.     }));  
  171.   
  172.     // 添加第二个节点(autoLoad)  
  173.     _treepanel.root.appendChild(new Ext.tree.TreeNode({  
  174.                 id : 'autoLoadPanel',  
  175.                 text : '通过autoLoad打开',  
  176.                 listeners : {  
  177.                     'click' : function(node, event) {  
  178.                         event.stopEvent();  
  179.                         var n = contentPanel.getComponent(node.id);  
  180.                         if (!n) { // //判断是否已经打开该面板  
  181.                             n = contentPanel.add({  
  182.                                         'id' : node.id,  
  183.                                         'title' : node.text,  
  184.                                         closable : true,  
  185.                                         autoLoad : {  
  186.                                             url : 'tabFrame.jsp?url=grid.html',  
  187.                                             scripts : true  
  188.                                         } // 通过autoLoad属性载入目标页,如果要用到脚本,必须加上scripts属性  
  189.                                     });  
  190.                         }  
  191.                         contentPanel.setActiveTab(n);  
  192.                     }  
  193.                 }  
  194.            }));    
  195.          
  196.       // 右边具体功能面板区  
  197.     var contentPanel = new Ext.TabPanel({  
  198.         region : 'center',  
  199.         enableTabScroll : true,  
  200.         activeTab : 0,  
  201.         items : [{  
  202.             id : 'homePage',  
  203.             title : '首页',  
  204.             autoScroll : true,  
  205.          //   closable : true,  
  206.             html : '<div class="tabPanel-treePanel">Tree控件和TabPanel控件结合功能演示</div>'  
  207.         }]  
  208.     });  
  209.   
  210.     new Ext.Viewport({  
  211.                 layout : 'border', // 使用border布局  
  212.                 defaults : {  
  213.                     activeItem : 0  
  214.                 },  
  215.                 items : [_treepanel, contentPanel]  
  216.             });  
  217.    
  218.               
  219. });  

其实这样子就可以运行了，只是动态加载的数据无法加载进去而已。以下是从后台数据库获取json格式数据的操作。

   1)建立一个树节点的bean，封装一个树节点。

   2)连接数据库，做相关操作之后，以json格式数据传回_treepanel.loader.dataUrl = 'tree.jsp?parentId=' + node.id; // 定义子节点的Loader。【实际上，就是一个字符串】

   3)tree.jsp

Code:
  1. <%@ page language="java" pageEncoding="utf-8"%>  
  2.   
  3. <jsp:useBean class="com.xxx.javabean.JSONTree" id="JSONTree"></jsp:useBean>  
  4.   
  5. <%  
  6.     String parentId = "";  
  7.     if (request.getParameter("parentId") != null) {  
  8.         parentId = request.getParameter("parentId").toString();  
  9.     }  
  10.     JSONTree.setparentId(parentId);  
  11. %>  
  12. <%=JSONTree.getJSONString()%>  
Code:
  1. package com.xxx.javabean;  
  2.   
  3. /** 
  4.  * @author nothing2012 
  5.  *定义树节点的属性，包括节点ID、Text、图标、是否为叶子节点、是否展开等。 
  6.  */  
  7.   
  8. public class JSONTreeNode {  
  9.     private String id;            //ID  
  10.     private String text;          //节点显示  
  11.     private String cls;           //图标  
  12.     private boolean leaf;         //是否叶子  
  13.     private String href;          //链接  
  14.     private String hrefTarget;    //链接指向  
  15.     private boolean expandable;   //是否展开  
  16.     private String description;   //描述信息  
  17.     public String getId() {  
  18.         return id;  
  19.     }  
  20.     public void setId(String id) {  
  21.         this.id = id;  
  22.     }  
  23.     public String getText() {  
  24.         return text;  
  25.     }  
  26.     public void setText(String text) {  
  27.         this.text = text;  
  28.     }  
  29.     public String getCls() {  
  30.         return cls;  
  31.     }  
  32.     public void setCls(String cls) {  
  33.         this.cls = cls;  
  34.     }  
  35.     public boolean isLeaf() {  
  36.         return leaf;  
  37.     }  
  38.     public void setLeaf(boolean leaf) {  
  39.         this.leaf = leaf;  
  40.     }  
  41.     public String getHref() {  
  42.         return href;  
  43.     }  
  44.     public void setHref(String href) {  
  45.         this.href = href;  
  46.     }  
  47.     public String getHrefTarget() {  
  48.         return hrefTarget;  
  49.     }  
  50.     public void setHrefTarget(String hrefTarget) {  
  51.         this.hrefTarget = hrefTarget;  
  52.     }  
  53.     public boolean isExpandable() {  
  54.         return expandable;  
  55.     }  
  56.     public void setExpandable(boolean expandable) {  
  57.         this.expandable = expandable;  
  58.     }  
  59.     public String getDescription() {  
  60.         return description;  
  61.     }  
  62.     public void setDescription(String description) {  
  63.         this.description = description;  
  64.     }  
  65. }  
Code:
  1. package com.xxx.javabean;  
  2.   
  3. import java.sql.Connection;  
  4. import java.sql.DriverManager;  
  5. import java.sql.ResultSet;  
  6. import java.sql.SQLException;  
  7. import java.sql.Statement;  
  8. import java.util.ArrayList;  
  9. import java.util.List;  
  10.   
  11. import net.sf.json.JSONArray;  
  12.   
  13. /* 
  14.  * @create by nothing2012 
  15.  */  
  16. public class JSONTree {  
  17.     private String parentId;  
  18.   
  19.     public String getJSONString() {  
  20.         Connection con = null;  
  21.         Statement st = null;  
  22.         ResultSet rs = null;  
  23.         List<JSONTreeNode> treeNodeArray = null;  
  24.         //传一个父节点的ID过来  
  25.         String SQLString = "SELECT * FROM Categories WHERE parentId="  
  26.                 + this.parentId + " ORDER BY categoryId";  
  27.         try {  
  28.             Class.forName("com.mysql.jdbc.Driver");  
  29.             DriverManager.registerDriver(new com.mysql.jdbc.Driver());  
  30.             String DbConn = "jdbc:mysql://localhost:3306/extjs";  
  31.             String DbPass = "root";  
  32.             con = DriverManager.getConnection(DbConn, "root", DbPass);  
  33.             st = con.createStatement();  
  34.             // 查找所有拥有下级类别的类别ID   //不同的记录属于同一个parentID，故使用group by  
  35.             rs = st  
  36.                     .executeQuery("SELECT parentId FROM Categories WHERE parentId>0 Group By parentId Order By parentId");  
  37.             StringBuffer parentIDBuffer = new StringBuffer();  
  38.             parentIDBuffer.append("|");  
  39.             while (rs.next()) {  
  40.                 parentIDBuffer.append(rs.getString("parentId"));  
  41.                 parentIDBuffer.append("|");  
  42.             }  
  43.             // 得到所有的parentcategoryId列表     
  44.             String parentIDString = parentIDBuffer.toString();  
  45.             System.out.println(parentIDString);//测试    |1|2|3|4|5|6|7|8|  
  46.             rs = st.executeQuery(SQLString);  //第一次传进来的parentID是0    
  47.             treeNodeArray = new ArrayList<JSONTreeNode>();  
  48.             while (rs.next()) {  
  49.                 JSONTreeNode treeNode = new JSONTreeNode();  
  50.                 String categoryId = rs.getString("categoryId");  
  51.                 treeNode.setId(categoryId);  
  52.                 treeNode.setText(rs.getString("categoryName"));  
  53.                 treeNode.setDescription(rs.getString("description"));  
  54.                 // treeNode.setHref("rightframe.jsp?categoryId="  
  55.                 // + rs.getString("categoryId").toString());  
  56.                 // treeNode.setHrefTarget("rightFrame");  
  57.                 System.out.println(parentIDString.indexOf("|" + categoryId + "|"));//测试  
  58.                 if (parentIDString.indexOf("|" + categoryId + "|") >= 0) // 父节点  如果大于0说它在父节点中存在  
  59.                 {  
  60.                     treeNode.setCls("folder");  
  61.                     treeNode.setLeaf(false);  
  62.                     treeNode.setExpandable(false);  
  63.                 } else // 子节点  
  64.                 {  
  65.                     treeNode.setCls("file");  
  66.                     treeNode.setLeaf(true);  
  67.                     treeNode.setExpandable(false);  
  68.                 }  
  69.                 treeNodeArray.add(treeNode);  
  70.             }  
  71.             JSONArray JsonArray = JSONArray.fromObject(treeNodeArray); // 得到JSON数组  
  72.             System.out.println("返回的数据是："+JsonArray.toString());  
  73.             return JsonArray.toString();// 返回JSON数据  
  74.         } catch (Exception e) {  
  75.             System.out.println("getJSONString() of JSONTree.java throws : "  
  76.                     + e.toString());  
  77.             return "";  
  78.         } finally {  
  79.             try {  
  80.                 if (con != null && !con.isClosed()) {  
  81.                     con.close();  
  82.                 }  
  83.             } catch (SQLException e) {  
  84.                 // TODO Auto-generated catch block  
  85.                 e.printStackTrace();  
  86.             }  
  87.         }  
  88.     }  
  89.   
  90.     public String getparentId() {  
  91.         return parentId;  
  92.     }  
  93.   
  94.     public void setparentId(String parentId) {  
  95.         this.parentId = parentId;  
  96.     }  
  97. }  

效果图：

//需要导入的json-lib 包及其他包自行下载。测试完毕。

 

你可能感兴趣的:(html,function,tree,null,border,autoload)

  • ＜电子幽灵＞前端第一件：HTML基础笔记下 靈镌sama 电子幽灵随手记前端html笔记
    HTML基础笔记（下）介绍费曼学习法最重要的部分，即把知识教给一个完全不懂的孩子——或者小白。为了更好的自我学习，也为了让第一次接触某个知识范畴的同学快速入门，我会把我的学习笔记整理成电子幽灵系列。提示：文章的是以解释-代码块-解释的结构呈现的。当你看到代码块并准备复制复现的时候，最好先保证自己看过了代码块前后的解释。＜电子幽灵＞前端第一件：HTML基础笔记上中，最基础的一部分HTML标签和已经以
  • 基于 Vue + RuoYi 架构设计的商城Web/小程序实训课程 速易达网络 springbootuni-appvue.js
    以下是基于Vue+RuoYi架构设计的商城Web/小程序实训课程方案，结合企业级开发需求与教学实践，涵盖全栈技术栈与实战模块：一、课程概述目标：通过Vue前端+RuoYi后端（SpringBoot）开发企业级电商系统，实现多终端（Web/H5/小程序）适配，覆盖从架构设计到部署上线的全流程。周期：8周（建议每日3小时）适合人群：具备基础Java/Vue知识的开发者，熟悉HTML/CSS/JavaS
  • 微信小程序实现websocket及单人聊天功能 蝶妹妹 微信小程序websocket小程序
    一、什么是websocket：WebSocket是HTML5下一种新的协议（websocket协议本质上是一个基于tcp的协议）它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的目的Websocket是一个持久化的协议二、websocket的原理：websocket约定了一个通信的规范，通过一个握手的机制，客户端和服务器之间能建立一个类似tcp的连接，从而方便它们之间的
  • GUI框架：谈谈框架 baozi3026 框架commandmfcbuttonclassstring
    转帖请注明出处http://www.cppblog.com/cexer/archive/2009/11/15/100988.html1开篇废话我喜欢用C++写GUI框架，因为那种成就感是实实在在地能看到的。从毕业到现在写了好多个了，都是实验性质的。什么拳脚飞刀毒暗器，激光核能反物质，不论是旁门左道的阴暗伎俩，还是名门正派的高明手段，只要是C++里有的技术都试过了。这当中接触过很多底层或是高级的技术
  • spring中maven缺少包如何重新加载，报错java: 程序包org.springframework.web.reactive.function不存在 东方-教育技术博主 javajavaspringmaven
    错误原因分析java:程序包org.springframework.web.reactive.function不存在这个错误是由于项目中缺少SpringWebFlux相关依赖导致的。org.springframework.web.reactive.function包属于SpringWebFlux模块（用于响应式Web开发），如果你的项目需要使用该包下的类（如RouterFunction、Serve
  • Arduino DS18B20编译错误解决方法 木子欢儿
    DS18B20.cpp:Inmemberfunction'uint8_tDS18B20::getResolution()':DS18B20.cpp:101:1:error:controlreachesendofnon-voidfunction[-Werror=return-type]101|}|^cc1plus.exe:somewarningsbeingtreatedaserrorsexitsta
  • 基于HTML的悬窗可拖动记事本 孤水寒月 htmlcss前端
    基于HTML的悬窗可拖动记事本这款记事本全部使用HTML+CSS+JS实现，可以在浏览器中实现悬浮可拖动的记事本，所有内容存储在浏览器中，清除缓存后将会丢失记事本内容效果展示实现代码Note+×保存删除//拖动逻辑constdraggableWindow=document.getElementById('draggableWindowNote');constdragHeader=doc
  • 二叉树的深搜（不定期更新。。。。。） Mr_Xuhhh javaandroid数据结构c++开发语言
    二叉树的深搜验证二叉搜索树给你一个二叉树的根节点root，判断其是否是一个有效的二叉搜索树。有效二叉搜索树定义如下：节点的左子树只包含小于当前节点的数。节点的右子树只包含大于当前节点的数。所有左子树和右子树自身必须也是二叉搜索树。示例1：输入：root=[2,1,3]输出：true示例2：输入：root=[5,1,4,null,null,3,6]输出：false解释：根节点的值是5，但是右子节点的
  • Vue 3 中 h 方法详解 yqcoder 前端javascript开发语言
    在Vue3中，h方法是一个用于创建虚拟DOM节点的函数，它是创建渲染函数的核心工具。一、引入h方法import{h}from"vue";constMyComponent={render(){returnh("div","Hello,Vue3!");},};二、语法h(type,props?,children?)1.type必填参数，表示要创建的节点类型。字符串：表示HTML标签名，如'div'、'
  • VC Spyglass：工具简介 日晨难再 Synopsys#VCSpyglass数字IC硬件工程
    相关阅读VCSpyglasshttps://blog.csdn.net/weixin_45791458/category_12828932.html?spm=1001.2014.3001.5482传统上，基于仿真的动态验证技术一直是功能验证的核心方式。随着现代SoC设计日益复杂，静态验证技术的引入变得愈发重要。Synopsys的VCSpyglass解决方案提供了下一代综合性的静态验证平台，包括：V
  • 使用vue-template-loader将模板编译成渲染函数的Webpack配置技巧 前端布洛芬 大白话前端八股vue.jswebpack前端
    大白话使用vue-template-loader将模板编译成渲染函数的Webpack配置技巧引言：被模板编译逼疯的周三下午你是否也经历过这样的场景：deadline前的周三下午，咖啡因已经失效，屏幕上却跳出Templatecompilationfailed的红色报错。Vue单文件组件（SFC）的.vue格式用腻了，想试试把模板抽成单独的.html文件，结果webpack配置直接给你脸色看。作为每天
  • 【SpringBoot初级篇】JdbcTemplate常用方法 李少谦 springboot数据库sql
    【SpringBoot初级篇】JdbcTemplate常用方法JdbcTemplate查询JdbcTemplate插入、更新、删除插入单条数据批量插入更新单条数据批量更新删除单条数据批量操作execute执行任意的SQLNamedParameterJdbcTemplate函数场景说明update(Stringsql,@NullableObject…args)增，删，改queryForObject(
  • 在 Vue 中使用 jQuery-UI 的踩坑记 qmzhna_ vue.jsjqueryui
    在使用leaflet开发的时候，有一个需求要在图层的popup上编辑信息，需要一个AutoComplete的组件。但是popup支持的是htmltemplate，只能通过js拼接HTML标签实现。不得已引入了jquery-ui中的AutoComplete组件来完成，在vue中使用jquery-ui过程中踩了不少坑。安装和引入jQuery和jQueryUI首先，我们需要在项目中安装jQuery和jQ
  • SHELL/SSH基础知识（入门篇）-包含 shell 脚本语言的基本用法、 shell 脚本语言的基本用法、流程控制、函数 function、其它脚本相关工具、数组 array(欢迎留言交流) 云计算小曹同学 正则表达式centoslinux运维ssh
    目录1shell脚本语言的基本用法1.1shell脚本注释规范1.1.1shell脚本注释规范1.1.2执行（5种）1.1.3在远程主机运行本地脚本1.1.4检查shell脚本1.2shell变量1.2.1Shell中变量命名法则1.2.2变量赋值与引用1.2.3环境变量的查看设置和删除1.2.4只读变量1.2.5位置变量1.2.6退出状态码变量1.2.7展开命令行1.3退出状态码变量1.4展开命
  • 数据结构之顺序表 Capricorn_man 数据结构
    一、创建头文件typedefintSLDataType;//动态存储typedefstructSeqList{SLDataType*a;//动态开辟的数组intsize;//有效数据的数量intcapacity;//空间大小}SL;二、初始化顺序表voidSLInit(SL*psl){assert(psl);psl->a=NULL;psl->size=0;psl->capacity=0;}三、销毁
  • 解密闭包：函数如何记住外部变量 有奇妙能力吗 知识分享Pythonpython开发语言
    什么是闭包？闭包是一个函数对象，它不仅记住它的代码逻辑，还记住了定义它时的自由变量（即非全局也非局部，但被内部函数引用的变量）。即使外部函数已经执行完毕，这些自由变量的值仍然保存在内存中，可以通过闭包访问和使用。简单来说：当一个嵌套的函数引用了其外部函数中的变量，并且这个嵌套函数可以在其外部函数之外被调用时，就形成了一个闭包。✅闭包的基本结构def outer_function(x):    de
  • 基于springboot+mysql+jpa+html实现商品销售信息系统 五星资源 springbootmysqljava
    基于springboot+mysql+jpa+html实现商品销售信息系统一、系统介绍1、系统主要功能：2.涉及技术框架：3.本项目所用环境：二、功能展示三、其它系统四、获取源码一、系统介绍1、系统主要功能：订单管理模块商品管理模块品牌管理模块分类管理模块客户管理模块供应商管理模块2.涉及技术框架：web框架：SpringBoot数据库框架：SpingDataJPA数据库：MySql项目构建工具：
  • 优秀开源库muduo阅读笔记 VictorLeo 网路编程服务端编程muduo
    muduo阅读笔记目录设计经验和思想服务端编程设计std::bind和std::function(基于closure闭包的编程)参考资料muduo开源库的笔记，比较杂，没有详细整理，现在就这么杂乱放着，等真的需要再好好整理。设计经验和思想对象构造做到线程安全，唯一的要求就是不要暴露this指针.即不要在构造函数中注册任何回调；也不要在构造函数中把this传给跨线程的对象；即便在构造函数的最后一行也
  • 1143 Lowest Common Ancestor (30 分)
    Thelowestcommonancestor(LCA)oftwonodesUandVinatreeisthedeepestnodethathasbothUandVasdescendants.Abinarysearchtree(BST)isrecursivelydefinedasabinarytreewhichhasthefollowingproperties:Theleftsubtreeofan
  • js获取文件夹中的所有文件和子文件夹 枫叶&情缘 JavaScriptjq前端javascript前端开发语言
    获取文件夹中的所有文件和子文件夹打开文件夹/***获取按钮元素并添加点击事件处理函数*/varbtn=document.querySelector('button');btn.onclick=asyncfunction(){//显示文件选择器constdirectoryHandle=awaitwindow.showDirectoryPicker();//处理目录awaitproecssHandle
  • 1143 Lowest Common Ancestor （30 分） 依久_ PAT甲
    Thelowestcommonancestor(LCA)oftwonodesUandVinatreeisthedeepestnodethathasbothUandVasdescendants.Abinarysearchtree(BST)isrecursivelydefinedasabinarytreewhichhasthefollowingproperties:Theleftsubtreeofan
  • 1151 LCA in a Binary Tree (30)
    Thelowestcommonancestor(LCA)oftwonodesUandVinatreeisthedeepestnodethathasbothUandVasdescendants.Givenanytwonodesinabinarytree,youaresupposedtofindtheirLCA.InputSpecification:Eachinputfilecontainsonete
  • 纯前端本地文件管理器（VSCode风格）(浏览器对本地文件增删改查) 与鱼有约 前端vscodeide
    纯前端本地文件管理器（VSCode风格）(浏览器对本地文件增删改查)简介本项目为一个纯前端实现的本地文件管理器网页（index.html），可在Chrome/Edge浏览器中直接打开，具备类似VSCode的本地文件夹操作体验。无需后端，所有功能均在浏览器端实现。主要功能选择本地文件夹用户点击左上角文件夹按钮，授权后可浏览和操作本地文件夹内容。文件树展示以树形结构展示所选文件夹下的所有文件和子文件夹
  • Java基础 集合框架 之Set框架之TreeSet 骑牛小道士 集合框架之Setjava开发语言
    TreeSetTreeSet数据结构及实现原理TreeSet的构造方法TreeSet核心特性有序性(`排序大小输出`)自然排序定制排序唯一性底层数据结构:红黑树导航方法(特色核心优势)基础导航方法范围视图（不修改原集合）提取和删除元素逆序视图不允许null元素TreeSet线程不安全TreeSet线程不安全体现解决方案TreeSet优缺点TreeSet应用场景类结构传承去区别于HashSet实现了
  • Java基础 集合框架 之Set框架之LinkedHashSet 骑牛小道士 集合框架之Setjava开发语言
    LinkedHashSetLinkedHashSet构造方法LinkedHashSet底层数据结构及实现原理LinkedHashSet核心特性有序性插入顺序排序伪访问顺序排序(LRU)元素唯一性底层数据结构:[哈希桶+(链表或红黑树)]+追加的双向链表允许null值LinkedHashSet线程不安全LinkedHashSet线程不安全体现解决方案LinkedHashSet优缺点以及适用场景pub
  • Github 2024-11-01 开源项目月报 Top19 老孙正经胡说 github开源Github趋势分析开源项目PythonGolang
    根据GithubTrendings的统计，本月(2024-11-01统计)共有19个项目上榜。根据开发语言中项目的数量，汇总情况如下：开发语言项目数量Python项目9TypeScript项目3JavaScript项目3Svelte项目1JupyterNotebook项目1Ruby项目1HTML项目1Rust项目1Java项目1C++项目1Go项目1Python中的算法实现集合创建周期：2831天
  • 用systemd管理GreatSQL服务详解 数据库mysql
    用systemd管理GreatSQL服务详解1.GreatSQL服务文件官网greatsql.service文件[Unit]Description=GreatSQLServerDocumentation=man:mysqld(8)Documentation=http://dev.mysql.com/doc/refman/en/using-systemd.htmlAfter=network.targ
  • 【验证码注册和登录表设计以及流程】 岁月玲珑 数据库微服务数据库
    验证码登录注册功能表设计针对手机/邮箱验证码登录和注册功能，我设计了以下表结构：--验证码表(love_auth_code_t)CREATETABLElove_auth_code_t(idBIGINTAUTO_INCREMENTPRIMARYKEYCOMMENT'验证码ID，主键',accountVARCHAR(100)NOTNULLCOMMENT'账号（手机号或邮箱）',codeVARCHAR(
  • OCCT 中 OCAF 事务开始结束的最佳时机
    std::stringGeometrySamples::CreateRevol(constTopoDS_Shape&shape,constgp_Dir&axis,doublestartAngle,doubleendAngle,boolisSolid){if(m_doc.IsNull()){qWarning()NewCommand();//最终检查并转换为实体if(isSolid&&!revolSh
  • Nginx 运维实战与 HTML 静态网页开发全攻略
    一、技术背景：静态站点的黄金时代1.静态网页的复兴浪潮性能优势：对比动态站点，静态资源响应速度提升60%+，首屏加载时间平均缩短1.2秒（基于WebPageTest实测数据）技术演进：Jamstack架构普及（2024年市场占有率达37%），Hugo、Nuxt.js等静态站点生成器（SSG）推动企业级应用典型场景：企业官网（占比78%）、产品着陆页（转化率提升23%）、博客系统（WordPress
  • Spring中@Value注解，需要注意的地方 无量 springbean@Valuexml
    Spring 3以后,支持@Value注解的方式获取properties文件中的配置值，简化了读取配置文件的复杂操作 1、在applicationContext.xml文件(或引用文件中)中配置properties文件 <bean id="appProperty" class="org.springframework.beans.fac
  • mongoDB 分片 开窍的石头 mongodb
        mongoDB的分片。要mongos查询数据时候 先查询configsvr看数据在那台shard上，configsvr上边放的是metar信息，指的是那条数据在那个片上。由此可以看出mongo在做分片的时候咱们至少要有一个configsvr,和两个以上的shard（片）信息。     第一步启动两台以上的mongo服务 &nb
  • OVER(PARTITION BY)函数用法 0624chenhong oracle
    这篇写得很好，引自 http://www.cnblogs.com/lanzi/archive/2010/10/26/1861338.html OVER(PARTITION BY)函数用法 2010年10月26日 OVER(PARTITION BY)函数介绍 开窗函数        &nb
  • Android开发中，ADB server didn't ACK 解决方法 一炮送你回车库 Android开发
    首先通知：凡是安装360、豌豆荚、腾讯管家的全部卸载，然后再尝试。   一直没搞明白这个问题咋出现的，但今天看到一个方法，搞定了！原来是豌豆荚占用了 5037 端口导致。 参见原文章：一个豌豆荚引发的血案——关于ADB server didn't ACK的问题 简单来讲，首先将Windows任务进程中的豌豆荚干掉，如果还是不行，再继续按下列步骤排查。 &nb
  • canvas中的像素绘制问题 换个号韩国红果果 JavaScriptcanvas
    pixl的绘制，1.如果绘制点正处于相邻像素交叉线，绘制x像素的线宽，则从交叉线分别向前向后绘制x/2个像素，如果x/2是整数，则刚好填满x个像素，如果是小数，则先把整数格填满，再去绘制剩下的小数部分，绘制时，是将小数部分的颜色用来除以一个像素的宽度，颜色会变淡。所以要用整数坐标来画的话（即绘制点正处于相邻像素交叉线时），线宽必须是2的整数倍。否则会出现不饱满的像素。 2.如果绘制点为一个像素的
  • 编码乱码问题 灵静志远 javajvmjsp编码
    1、JVM中单个字符占用的字节长度跟编码方式有关，而默认编码方式又跟平台是一一对应的或说平台决定了默认字符编码方式；2、对于单个字符：ISO-8859-1单字节编码，GBK双字节编码，UTF-8三字节编码；因此中文平台(中文平台默认字符集编码GBK)下一个中文字符占2个字节，而英文平台(英文平台默认字符集编码Cp1252(类似于ISO-8859-1))。 3、getBytes()、getByte
  • java 求几个月后的日期 darkranger calendargetinstance
    Date plandate = planDate.toDate(); SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd"); Calendar cal = Calendar.getInstance(); cal.setTime(plandate); // 取得三个月后时间 cal.add(Calendar.M
  • 数据库设计的三大范式（通俗易懂） aijuans 数据库复习
    关系数据库中的关系必须满足一定的要求。满足不同程度要求的为不同范式。数据库的设计范式是数据库设计所需要满足的规范。只有理解数据库的设计范式，才能设计出高效率、优雅的数据库，否则可能会设计出错误的数据库. 目前，主要有六种范式：第一范式、第二范式、第三范式、BC范式、第四范式和第五范式。满足最低要求的叫第一范式，简称1NF。在第一范式基础上进一步满足一些要求的为第二范式，简称2NF。其余依此类推。
  • 想学工作流怎么入手 atongyeye jbpm
    工作流在工作中变得越来越重要，很多朋友想学工作流却不知如何入手。 很多朋友习惯性的这看一点，那了解一点，既不系统，也容易半途而废。好比学武功，最好的办法是有一本武功秘籍。研究明白，则犹如打通任督二脉。 系统学习工作流，很重要的一本书《JBPM工作流开发指南》。 本人苦苦学习两个月，基本上可以解决大部分流程问题。整理一下学习思路，有兴趣的朋友可以参考下。 1  首先要
  • Context和SQLiteOpenHelper创建数据库 百合不是茶 androidContext创建数据库
           一直以为安卓数据库的创建就是使用SQLiteOpenHelper创建,但是最近在android的一本书上看到了Context也可以创建数据库,下面我们一起分析这两种方式创建数据库的方式和区别,重点在SQLiteOpenHelper     一:SQLiteOpenHelper创建数据库:   1,SQLi
  • 浅谈group by和distinct bijian1013 oracle数据库group bydistinct
            group by和distinct只了去重意义一样，但是group by应用范围更广泛些，如分组汇总或者从聚合函数里筛选数据等。         譬如：统计每id数并且只显示数大于3 select id ,count(id) from ta
  • vi opertion 征客丶 macoprationvi
    进入 command mode （命令行模式） 按 esc 键 再按 shift + 冒号 注：以下命令中 带 $ 【在命令行模式下进行】，不带 $ 【在非命令行模式下进行】 一、文件操作 1.1、强制退出不保存 $ q! 1.2、保存 $ w 1.3、保存并退出 $ wq 1.4、刷新或重新加载已打开的文件 $ e 二、光标移动 2.1、跳到指定行 数字
  • 【Spark十四】深入Spark RDD第三部分RDD基本API bit1129 spark
      对于K/V类型的RDD,如下操作是什么含义？   val rdd = sc.parallelize(List(("A",3),("C",6),("A",1),("B",5)) rdd.reduceByKey(_+_).collect  reduceByKey在这里的操作，是把
  • java类加载机制 BlueSkator java虚拟机
    java类加载机制 1.java类加载器的树状结构 引导类加载器 ^ | 扩展类加载器 ^ | 系统类加载器 java使用代理模式来完成类加载，java的类加载器也有类似于继承的关系，引导类是最顶层的加载器，它是所有类的根加载器，它负责加载java核心库。当一个类加载器接到装载类到虚拟机的请求时，通常会代理给父类加载器，若已经是根加载器了，就自己完成加载。 虚拟机区分一个Cla
  • 动态添加文本框 BreakingBad 文本框
      <script>     var num=1; function AddInput() {      var str="";     str+="<input 
  • 读《研磨设计模式》-代码笔记-单例模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ public class Singleton { } /* * 懒汉模式。注意，getInstance如果在多线程环境中调用，需要加上synchronized，否则存在线程不安全问题 */ class LazySingleton
  • iOS应用打包发布常见问题 chenhbc iosiOS发布iOS上传iOS打包
    这个月公司安排我一个人做iOS客户端开发，由于急着用，我先发布一个版本，由于第一次发布iOS应用，期间出了不少问题，记录于此。   1、使用Application Loader 发布时报错：Communication error.please use diagnostic mode to check connectivity.you need to have outbound acc
  • 工作流复杂拓扑结构处理新思路 comsci 设计模式工作算法企业应用OO
    我们走的设计路线和国外的产品不太一样，不一样在哪里呢？  国外的流程的设计思路是通过事先定义一整套规则(类似XPDL)来约束和控制流程图的复杂度(我对国外的产品了解不够多，仅仅是在有限的了解程度上面提出这样的看法)，从而避免在流程引擎中处理这些复杂的图的问题，而我们却没有通过事先定义这样的复杂的规则来约束和降低用户自定义流程图的灵活性，这样一来，在引擎和流程流转控制这一个层面就会遇到很
  • oracle 11g新特性Flashback data archive daizj oracle
    1. 什么是flashback data archive Flashback data archive是oracle 11g中引入的一个新特性。Flashback archive是一个新的数据库对象，用于存储一个或多表的历史数据。Flashback archive是一个逻辑对象，概念上类似于表空间。实际上flashback archive可以看作是存储一个或多个表的所有事务变化的逻辑空间。
  • 多叉树:2-3-4树 dieslrae 树
        平衡树多叉树,每个节点最多有4个子节点和3个数据项,2,3,4的含义是指一个节点可能含有的子节点的个数,效率比红黑树稍差.一般不允许出现重复关键字值.2-3-4树有以下特征:     1、有一个数据项的节点总是有2个子节点(称为2-节点)     2、有两个数据项的节点总是有3个子节点(称为3-节
  • C语言学习七动态分配 malloc的使用 dcj3sjt126com clanguagemalloc
    /* 2013年3月15日15:16:24 malloc 就memory(内存) allocate(分配)的缩写 本程序没有实际含义，只是理解使用 */ # include <stdio.h> # include <malloc.h> int main(void) { int i = 5; //分配了4个字节 静态分配 int * p
  • Objective-C编码规范[译] dcj3sjt126com 代码规范
      原文链接 : The official raywenderlich.com Objective-C style guide 原文作者 : raywenderlich.com Team 译文出自 : raywenderlich.com Objective-C编码规范 译者 : Sam Lau
  • 0.性能优化-目录 frank1234 性能优化
    从今天开始笔者陆续发表一些性能测试相关的文章，主要是对自己前段时间学习的总结，由于水平有限，性能测试领域很深，本人理解的也比较浅，欢迎各位大咖批评指正。 主要内容包括： 一、性能测试指标 吞吐量、TPS、响应时间、负载、可扩展性、PV、思考时间 http://frank1234.iteye.com/blog/2180305 二、性能测试策略 生产环境相同 基准测试 预热等 htt
  • Java父类取得子类传递的泛型参数Class类型 happyqing java泛型父类子类Class
      import java.lang.reflect.ParameterizedType; import java.lang.reflect.Type; import org.junit.Test; abstract class BaseDao<T> { public void getType() { //Class<E> clazz =
  • 跟我学SpringMVC目录汇总贴、PDF下载、源码下载 jinnianshilongnian springMVC
      ----广告-------------------------------------------------------------- 网站核心商详页开发 掌握Java技术，掌握并发/异步工具使用，熟悉spring、ibatis框架； 掌握数据库技术，表设计和索引优化，分库分表/读写分离； 了解缓存技术，熟练使用如Redis/Memcached等主流技术； 了解Ngin
  • the HTTP rewrite module requires the PCRE library 流浪鱼 rewrite
    ./configure: error: the HTTP rewrite module requires the PCRE library. 模块依赖性Nginx需要依赖下面3个包 1. gzip 模块需要 zlib 库 ( 下载: http://www.zlib.net/ ) 2. rewrite 模块需要 pcre 库 ( 下载: http://www.pcre.org/ ) 3. s
  • 第12章 Ajax（中） onestopweb Ajax
    index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
  • Optimize query with Query Stripping in Web Intelligence blueoxygen BO
    http://wiki.sdn.sap.com/wiki/display/BOBJ/Optimize+query+with+Query+Stripping+in+Web+Intelligence and a very straightfoward video http://www.sdn.sap.com/irj/scn/events?rid=/library/uuid/40ec3a0c-936
  • Java开发者写SQL时常犯的10个错误 tomcat_oracle javasql
    1、不用PreparedStatements 　　有意思的是，在JDBC出现了许多年后的今天，这个错误依然出现在博客、论坛和邮件列表中，即便要记住和理解它是一件很简单的事。开发者不使用PreparedStatements的原因可能有如下几个： 　　他们对PreparedStatements不了解 　　他们认为使用PreparedStatements太慢了 　　他们认为写Prepar
  • 世纪互联与结盟有感 阿尔萨斯
    10月10日，世纪互联与（Foxcon）签约成立合资公司，有感。 全球电子制造业巨头（全球500强企业）与世纪互联共同看好IDC、云计算等业务在中国的增长空间，双方迅速果断出手，在资本层面上达成合作，此举体现了全球电子制造业巨头对世纪互联IDC业务的欣赏与信任，另一方面反映出世纪互联目前良好的运营状况与广阔的发展前景。 众所周知，精于电子产品制造（世界第一），对于世纪互联而言，能够与结盟
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他