jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"( S1 @8 @* I8 Q# D! P" n8 B
      c pageencoding="gb2312"
%>
<style>2 [* F4 I) c9 V* G* k
.f9{ font-size:9pt; }9 O" q1 s8 K6 D) Q" W
.bgc{ background-color:#aecaf9; color: #0033ff }+ Z8 L( @8 p$ Z" M1 Z; V
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
  border-bottom: solid 1px #4e7dc1;+ z7 P- I& e5 n% l4 I- n6 C5 J
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;7 d: {( D  v4 U6 _/ ~
  padding:1px;
  margin:0px;}
</style>
<script language="javascript">
+ u) S# M. G, C. V
</script>
0 p$ D. S( o' W<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">7 j3 ^5 e, F2 W( D
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
" M  f  ?5 r9 }; _# c) F  K0 f<%7 M! L0 O( E0 E! G
  cdatasource ds=new cdatasource();  //数据联结bean实例, ?5 B; k/ G7 G2 d5 A
  java.sql.connection conn=ds.getconnection();
* A6 i+ j* Z" |" r  h$ f5 |& ^0 f  java.sql.statement stmt=null;
6 L. V( D2 I- f4 U0 ~; E( ~  java.sql.resultset rs=null;* h6 K& k1 a1 ~
  cdatacheck dc=new cdatacheck();2 K& T) v" b# f$ g" A
%>* Y( l4 d. _6 I' d
<%/ z  v8 \5 z. C; ]6 A
string sqlu="select t1.fno, t1.fname, t2.fname as fdept from tuser t1 left outer join tdept t2 on t1.fdept = t2.fno order by t2.fname";
! H. \5 ^- I6 C4 Jstmt=conn.createstatement();
6 o7 l/ J8 u8 Grs=stmt.executequery(sqlu);' }# [* v: ^* @9 z
%>1 W$ @  ?3 ]# h! j/ @1 C! ?( H& n
<script language='javascript'>+ h- s8 S. \. M+ \/ X
arr = new array();8 @# h' T: F( J3 P" F) g1 _
<%  int temp=0;' H, \% z0 N- Y  S+ ^8 `
while(rs.next())
9 d" o$ q5 \: r+ Z$ Q{
, _7 V4 m4 C8 H" M%>
  D" k4 ^- D0 g$ O4 L. D9 u5 @7 `arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");9 _! c! H* L, x# g
<%) I; y, t; W* t- l
temp = temp + 1;
0 M/ K% f8 f: _+ v- \# U6 w, I}
( w/ r9 ?  |* ?) {+ j) n" h%>
$ U+ P; n3 u0 [6 m3 Z. btemp=<%=temp%>;
# y, b5 a! |5 Z0 Dfunction changelocation(id){ 9 ~* j2 D; W2 I. b, c8 S- w
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
- i7 }3 K' u% I: l% c) R9 }  bvar i = 0;
$ E- J; m0 S" J, D1 Xdocument.combo_box.city.options[0]=new option('-------',''); . @3 S8 p6 S9 Z, m7 a# M
for(i=0;i<temp;i++){
! Z/ L8 O: [9 U( a. Zif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
! j8 j- i) P: ddocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); # g, i' I( L- z! O
} ( b7 @4 h- ^1 Y  f0 i: k2 O# w# t
}
0 X* q% {3 K7 i6 k: f}
: _  w$ ]2 N. [7 n2 b</script>
) N/ C+ p0 F0 W3 U/ d3 {5 [+ o! C0 a9 Q6 [5 y7 A4 t  T
<form name="combo_box">! p8 o* i) D) O( P1 h4 [3 N9 A
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">% m  {; p- d1 x+ r
  <tr height="24">' y5 F6 J) d1 _( d1 f# F
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
1 n$ o" z6 j" w+ \# P% Z <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
. f0 L$ U2 D+ o <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( p. V/ y$ z5 K: j <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>7 g7 r" z) r" z' L7 ~% q- t3 W
  </tr>
! O4 x; D" c, H  C  <tr>
  Y! `7 M8 x* g- m9 ] <td>6 S7 R! g! H" l5 n- O4 I! y
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
: k4 ?1 S$ Q- a4 X: \2 s) V  <option value="0">请选择部门 ---></option>
* K  M% m$ V3 f8 u! d<%
8 G" z0 o& T2 t; e) u string sqld="select * from tdept";
2 I" X6 Y( {( C+ Ystmt=conn.createstatement();+ m. I% {& M5 c5 T8 `) S$ a
rs=stmt.executequery(sqld);
. u; e; ^5 |2 b, B( M" K- Q# L; l0 Zwhile(rs.next())
( ]* j, I9 D0 I1 a# c: O% K{% q* q) |3 d* A, X5 V$ ?
%>( d+ E  E# M4 H( Q- @2 n
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>& V) [$ C! r- P2 H2 H& l* _
<%
6 N/ R! C  w  z' [}
  V6 z2 H- |2 `# V' V" N%>
! r( D* f: B3 J9 ^" e) j' R  </select>
2 C( P, D9 B% u$ [- Z* n( Q0 m</td>
/ K, s* Q/ W$ K  v  |' C <td>
* k: E1 e3 g7 d& S7 k" s" H% A  <select multiple id=city style="width:150;height:200" class="bgc">
" g1 h* K) C/ ^5 c* l2 m9 |/ p  </select>8 Q4 W8 f; U8 S- i, l  C7 A" F
</td>
5 u" y% O: I# Z* ?# E8 n <td nowrap align="center" class="bgc">
4 k5 N" C9 N: A3 l  <input type="button"  value="<<" class="buttons">( d/ o$ E  y0 |9 v
  <input type="button"  value=">>" class="buttons">9 `6 f$ a3 X) I& z: G9 O3 r4 e5 P
</td># |& @) [- x, G- Z% _1 L+ V( `
<td>
" c' G7 D$ Y2 f) k$ ?# q  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">/ W: {8 q' R% t  j
  </select>* G8 i+ g% \% p8 r
</td>5 b2 E6 w) h) }* p9 N4 k
  </tr>
4 Q) E: P: d5 X3 n <tr class="bgc">
5 J0 w/ i* m8 F/ L1 S- T) v+ y# X <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
1 l8 D+ _9 D* X8 l* R+ d, T. ~( E8 D  </tr>
5 j3 R$ A3 e, G: C; A, j</table># @" n0 x% N: }1 G$ b2 q
</form>  s  \* F5 j# u0 Z7 u& P/ r! {: `" X
<script language="javascript">6 d9 E& S* W( F# ~; d; ^
//人名移动
% r3 V# ?0 @5 F( Q8 i5 Sfunction move(fbox, tbox) {' o) O& S4 M$ k* w) O
var arrfbox = new array();
! c  ]. p  B( @! A% {+ K, Evar arrtbox = new array();
4 }" G) U* b( M& \var arrlookup = new array();1 l. C, e9 ]; P8 Q& N& f  |% e
var i;9 f1 r/ Z" ~0 R+ j$ }: ?& ^! O# L9 H
for (i = 0; i < tbox.options.length; i++) {( ?. Z  a2 g; S
arrlookup[tbox.options.text] = tbox.options.value;  |/ c( ~; B( E
arrtbox = tbox.options.text;" u- `% }+ W8 s& f
}
) Q- L( ]& V6 ^( b+ Rvar flength = 0;
/ a# W" F; }+ c" Jvar tlength = arrtbox.length;  C' M: u+ O% ~# i+ k# J
for(i = 0; i < fbox.options.length; i++) {% W- [( D" A, J9 V) \3 e- a( J
arrlookup[fbox.options.text] = fbox.options.value;
. f. ?; `/ {6 ~# A! K- h4 Xif (fbox.options.selected && fbox.options.value != "") {* ^! V" H+ b$ {; h8 ~+ Q
arrtbox[tlength] = fbox.options.text;
$ H9 j; ?! H# i  K. btlength++;
4 o) y/ m8 u( S% e  T+ E+ ^}) }" v7 T: S, p! \& Z! s) V! n
else {, h" X) a3 Z% ]( _1 I
arrfbox[flength] = fbox.options.text;
+ S4 u% O" d* ]. J; Iflength++;
' o  H( \2 O; l+ {( ] }( Y" p0 F/ D) b
}
0 c, l2 P1 {6 c/ n" Aarrfbox.sort();4 ^8 ~# V  Z* p( g/ k& R
arrtbox.sort();  R7 R$ |% C9 C

  x0 @& ?7 \, b& z# y/ n" ]$ Wfbox.length = 0;
- |* V" {3 M% B+ A: j3 dtbox.length = 0;! A8 \! |6 u7 D0 R7 v# ^2 n0 G
var c;, E' m7 L7 q. i. Z
for(c = 0; c < arrfbox.length; c++) {
( b* E$ @; |+ L+ u4 mvar no = new option();/ ~7 W: C+ J" E7 x- g
no.value = arrlookup[arrfbox[c]];
  c) z. y7 T9 {6 v& e. ^no.text = arrfbox[c];
8 \  `4 ^! N. A/ Nfbox[c] = no;
& h  [# z, h3 C6 b6 h% k0 r}
1 d6 D+ M5 Q7 |- D. sfor(c = 0; c < arrtbox.length; c++) {/ H0 w- r/ {) p
var no = new option();
  Q. _3 N5 Z1 e1 s0 G$ d1 ?5 eno.value = arrlookup[arrtbox[c]];# p1 d  s7 B! x* M- I, W9 G
no.text = arrtbox[c];
( A  f% F# K" ~6 W, Etbox[c] = no;: g, Q: e  n0 G% N
}' j0 U; ^$ B; Y' L
}6 y2 @  z5 W5 b0 ~: J/ H+ ^9 V7 o% u) t
</script>
' H- J# c' Y- l9 }0 v5 d2 w* j</body>- Q  _* I) W: j( ]2 Z0 ]2 t9 O/ G

捌玖网络 89w.org----致力于站长学习交流

返回列表

jsp+javascript打造级连菜单

[收藏此主题] [关注此主题的新回复]

[通过 QQ、MSN 分享给朋友]