国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
徹底搞定 tree 菜單(xloadtree)
徹底搞定 tree 菜單

以前搞tree,接觸的多的是 dtree,

dtree效果也還不錯(cuò),一下子將所有的節(jié)點(diǎn)從底到高,一級(jí)一級(jí)的遍歷,將基點(diǎn)一次性加載到客戶端,由客戶端來(lái)生成菜單,網(wǎng)上很多聲音說(shuō)不適合大型的應(yīng)用,對(duì)這種方式的菜單不喜歡的也很多;

還有一種方式是點(diǎn)一下加載該級(jí)菜單的子級(jí)菜單,再點(diǎn)再加載,避免了一次性加載數(shù)量過(guò)大的原因,但,這種方式將數(shù)據(jù)保存在服務(wù)端,也就是說(shuō)每次點(diǎn)擊都會(huì)請(qǐng)求服務(wù)器,也會(huì)很浪費(fèi)資源,

現(xiàn)在考慮的方式是,點(diǎn)擊一個(gè)節(jié)點(diǎn),加載這個(gè)節(jié)點(diǎn)下面的子級(jí)節(jié)點(diǎn)到客戶端,再點(diǎn)就不會(huì)去重復(fù)加載了,只加載沒(méi)有加載過(guò)的,即,將加載后的菜單保存到本地,這種方式,同時(shí)避免了dtree加載量大的問(wèn)題,也避免了重復(fù)加載的問(wèn)題,所以,還猶豫什么了,當(dāng)然選擇這個(gè)來(lái)作為我們的應(yīng)用了,說(shuō)到這里可能還不知道這個(gè)東西是啥,它叫“xloadtree”,是什么我就不再贅述,傳說(shuō)中CSDN的導(dǎo)航菜單也蠻不錯(cuò)的,感覺(jué)也是這種效果,是叫“梅花雪”的,什么的。

成功實(shí)現(xiàn)這樣一個(gè)樹菜單,我考慮的如下問(wèn)題:

1、數(shù)據(jù)來(lái)源于數(shù)據(jù)庫(kù)

2、解決常規(guī)性的問(wèn)題

3、能夠應(yīng)用到系統(tǒng)中去

1、先說(shuō)說(shuō)數(shù)據(jù)庫(kù)表結(jié)構(gòu)

數(shù)據(jù)庫(kù)名稱為 :Struts ,新建表名稱為 xloadtree,建表語(yǔ)句如下:

create table xloadtree(
xl_id int identity(1,1) primary key,--自增ID
xl_text varchar(50) default '',--節(jié)點(diǎn)名稱
xl_action varchar(200) default '',--節(jié)點(diǎn)地址
xl_target varchar(50) default '',--提交方式
xl_fatherid int default -1--上級(jí)結(jié)點(diǎn)
)
go
--drop table xloadtree
select * from xloadtree
go
--添加根節(jié)點(diǎn)
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('中國(guó)','javascript:void(0);','',-1);
--添加第一級(jí)子節(jié)點(diǎn)
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('北京','http://www.beijing.com','framecdd',1);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('湖北','http://www.hubei.com','framecdd',1);
--添加第二級(jí)子節(jié)點(diǎn)
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('海淀區(qū)','http://www.hdq.com','framecdd',2);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('朝陽(yáng)區(qū)','http://www.cyq.com','framecdd',2);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('延慶區(qū)','http://www.yqq.com','framecdd',2);

insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('武漢市','http://www.wuhan.com','framecdd',3);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('襄樊市','http://www.xiangfan.com','framecdd',3);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('荊州市','http://www.jinzhou.com','framecdd',3);
--添加第4級(jí)子節(jié)點(diǎn)
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('武昌','http://www.wuchangqu.com','framecdd',7);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('漢口','http://www.hankou.com','framecdd',7);

insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('老河口市','http://www.laohekou.com','framecdd',8);
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('谷城縣','http://www.laohekou.com','framecdd',8);
--第一級(jí)菜單
insert into xloadtree(xl_text,xl_action,xl_target,xl_fatherid)
values('上海','http://www.shanghai.com','framecdd',1);


2、面向這個(gè)tree的JavaBean對(duì)象,如下:

package com.db;

public class TreeBean {

private int xl_id = 0;
private String xl_title = "";
private String xl_action = "";
private String xl_target = "";
private int xl_fatherid = 0;

public int getXl_fatherid() {
return xl_fatherid;
}

public void setXl_fatherid(int xl_fatherid) {
this.xl_fatherid = xl_fatherid;
}

public int getXl_id() {
return xl_id;
}

public void setXl_id(int xl_id) {
this.xl_id = xl_id;
}

public String getXl_target() {
return xl_target;
}

public void setXl_target(String xl_target) {
this.xl_target = xl_target;
}

public String getXl_title() {
return xl_title;
}

public void setXl_title(String xl_title) {
this.xl_title = xl_title;
}

public String getXl_action() {
return xl_action;
}

public void setXl_action(String xl_action) {
this.xl_action = xl_action;
}

}
3、數(shù)據(jù)庫(kù)現(xiàn)在給出的是2005的鏈接:

package com.db;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.SQLException;

public class DBManager {

private final static String DRIVER_NAME = "com.microsoft.sqlserver.jdbc.SQLServerDriver";
private final static String URL = "jdbc:sqlserver://localhost:1433;databasename=Struts;";
private final static String USERNAME = "sa";
private final static String PASSWORD = "";


public static Connection getConnection(){

Connection conn = null;
try {
Class.forName(DRIVER_NAME);
conn = DriverManager.getConnection(URL, USERNAME, PASSWORD);
} catch (Exception e) {
System.out.println("打開數(shù)據(jù)庫(kù)鏈接異常...");
e.printStackTrace();
}
return conn;
}

public static void Close(Connection conn){
if(conn!=null)
try {
conn.close();
} catch (SQLException e) {
e.printStackTrace();
}
}

/**
* @param args
* @throws Exception
*/
public static void main(String[] args) throws Exception {

}

}
4、顯示tree的頁(yè)面代碼為:

<%@ page language="java" pageEncoding="UTF-8"%>
<jsp:directive.page import="com.db.DBManager" />
<jsp:directive.page import="java.sql.Connection" />
<jsp:directive.page import="java.sql.PreparedStatement" />
<jsp:directive.page import="java.sql.ResultSet" />
<jsp:directive.page import="com.db.TreeBean" />
<jsp:directive.page import="java.util.ArrayList" />
<%
Connection conn = DBManager.getConnection();
String sql = "select top 1 * from xloadtree where xl_fatherid = -1 union all select * from xloadtree where xl_fatherid = 1";
PreparedStatement pst = conn.prepareStatement(sql);
ResultSet rs = pst.executeQuery();
ArrayList<TreeBean> arrayList = new ArrayList<TreeBean>();
while (rs!=null&&rs.next()) {
TreeBean bean = new TreeBean();
bean.setXl_id(rs.getInt(1));
bean.setXl_title(rs.getString(2));
bean.setXl_action(rs.getString(3));
bean.setXl_target(rs.getString(4));
bean.setXl_fatherid(rs.getInt(5));
arrayList.add(bean);
}
rs.close();
pst.close();
DBManager.Close(conn);
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>例子</title>
<script type="text/javascript" src="/xloadtree/xloadtree/xtree.js"></script>
<script type="text/javascript" src="/xloadtree/xloadtree/xmlextras.js"></script>
<script type="text/javascript" src="/xloadtree/xloadtree/xloadtree.js"></script>
<script type="text/javascript" src="/xloadtree/xloadtree/json_parse.js"></script>
<script type="text/javascript" src="/xloadtree/xloadtree/json2.js"></script>
<link rel="stylesheet" type="text/css"
href="/xloadtree/xloadtree/xtree.css" />
</head>

<body>

<%
TreeBean first = arrayList.get(0);

%>

<script type="text/javascript">

try{

var tree = new WebFXLoadTree("<%=first.getXl_title() %>","loadtree.jsp?xl_id=1");

<%
StringBuilder sb = new StringBuilder();
sb.append("[");
for(int i=1;i<arrayList.size();i++){
TreeBean bean = arrayList.get(i);
if(i==arrayList.size()){
sb.append("{\"text\":\"" + bean.getXl_title() + "\",\"action\":\"" + bean.getXl_action() + "\",\"target\":\"" + bean.getXl_target() + "\",\"src\":\"loadtree.jsp?xl_id=" + bean.getXl_id() + "\"}");
}else{
sb.append("{\"text\":\"" + bean.getXl_title() + "\",\"action\":\"" + bean.getXl_action() + "\",\"target\":\"" + bean.getXl_target() + "\",\"src\":\"loadtree.jsp?xl_id=" + bean.getXl_id() + "\"},");
}
%>
<%
}
sb.append("]");
%>
document.write(tree);

}catch(e){
alert(e.description);
}
</script>

<iframe frameborder="1" align="right" src="#" name="framecdd" id="framecdd" width="60%" height="60%"></iframe>

</body>
</html>

5、加載子級(jí)tree節(jié)點(diǎn)的頁(yè)面代碼為:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<jsp:directive.page import="java.sql.Connection"/>
<jsp:directive.page import="com.db.DBManager"/>
<jsp:directive.page import="java.sql.PreparedStatement"/>
<jsp:directive.page import="java.sql.ResultSet"/>
<%
String reqxl_id = request.getParameter("xl_id")==null?"0":request.getParameter("xl_id");
Connection conn = DBManager.getConnection();
String sql = "select * from xloadtree where xl_fatherid = " + reqxl_id;

PreparedStatement pst = conn.prepareStatement(sql,1005,1007);
ResultSet rs = pst.executeQuery();

rs.last();
int counts = rs.getRow();

int num = 1;

StringBuilder sb = new StringBuilder();
sb.append("[");
rs.absolute(0);
while(rs!=null&&rs.next()){
int id = rs.getInt(1);
String text = rs.getString(2);
String action = rs.getString(3);
String target = rs.getString(4);
int father = rs.getInt(5);
if(num==counts){
sb.append("{\"text\":\"" + text + "\",\"action\":\"" + action + "\",\"target\":\"" + target + "\",\"src\":\"loadtree.jsp?xl_id=" + id + "\"}");
}else{
sb.append("{\"text\":\"" + text + "\",\"action\":\"" + action + "\",\"target\":\"" + target + "\",\"src\":\"loadtree.jsp?xl_id=" + id + "\"},");
}
num++;
}

sb.append("]");
rs.close();
pst.close();
conn.close();

out.println(sb.toString());
%>

就這么點(diǎn)點(diǎn),當(dāng)然了,除了這部分的東西,當(dāng)然還需要xloadtree這部分的東西了。

運(yùn)行效果如圖:


看到這個(gè)效果圖,會(huì)感覺(jué)跟dtree或其他的沒(méi)什么區(qū)別,呵呵,可別看小了這點(diǎn)。有學(xué)問(wèn)的。

以上的例子,只為實(shí)現(xiàn)功能,部分代碼寫的不夠合理,這里旨在實(shí)現(xiàn)。

這個(gè)控件實(shí)現(xiàn)的樹,無(wú)限極的就不用說(shuō)了,點(diǎn)擊加載的時(shí)候有 loading...效果,其中有個(gè)問(wèn)題,就是根節(jié)點(diǎn)的子節(jié)點(diǎn),也就是第二級(jí)節(jié)點(diǎn)不好做,這里也實(shí)現(xiàn)了。

本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
Dtree+Jquery動(dòng)態(tài)生成樹節(jié)點(diǎn)例子
jsp 連接access數(shù)據(jù)庫(kù)實(shí)例
JSP連接SQL數(shù)據(jù)庫(kù)實(shí)現(xiàn)查找/插入信息
樹形目錄的遞歸實(shí)現(xiàn)數(shù)據(jù)庫(kù)+jsp+javabean
JSP購(gòu)物車實(shí)例[一]
JSP與樹型菜單
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長(zhǎng)圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服