📄 用jsp实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.htm
字号:
href="http://uni.sina.com.cn/c.php?t=blog&k=jsp&ts=bpost&stype=tag"
target=_blank>jsp</A><WBR> <A class=tag
href="http://uni.sina.com.cn/c.php?t=blog&k=it&ts=bpost&stype=tag"
target=_blank>it</A><WBR> </TD>
<TD vAlign=top align=right width=225>分类：<A
href="http://blog.sina.com.cn/s/articlelist_1337271565_4_1.html">java设计及理念</A></TD></TR></TBODY></TABLE></DIV>
<DIV class=articleContent id=articleBody>
<P>一、在数据库数据库中建立三个表<BR>1.city<BR>字段：<BR>districtname，locationid，districtid<BR>2.province<BR>字段：<BR>locationid，locationname<BR>3.village<BR>字段：<BR>villageid,villagename,districtid<BR>二、代码如下：<BR><%@
page language="java" contentType="text/html;
charset=gb2312"<BR> <WBR> <WBR> <WBR>
pageEncoding="gb2312"%><BR><%@ page import="java.sql.*
"%><BR><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN"><BR><html><BR><head><BR><meta
http-equiv="Content-Type" content="text/html;
charset=gb2312"><BR><title>jsp实现三级联动的下拉列表框效果</title><BR><%<BR> <WBR> <WBR>
Connection conn=null;<BR> <WBR> <WBR> Statement
stmt=null;<BR> <WBR> <WBR> ResultSet
rs=null,rs1=null,rs2=null;<BR> <WBR> <WBR> String
sql;<BR> <WBR> <WBR> int count;<BR> <WBR> <WBR> int
count2;<BR> <WBR> <WBR> String
drivername="com.microsoft.jdbc.sqlserver.SQLServerDriver";<BR> <WBR> <WBR>
String
url="jdbc:microsoft:sqlserver://localhost:1433;DatabaseName=SJLD";<BR> <WBR> <WBR>
try{<BR> <WBR> <WBR> <WBR>
Class.forName(drivername);<BR> <WBR> <WBR> <WBR>
conn=DriverManager.getConnection(url,"sa","");<BR> <WBR> <WBR> <WBR>
stmt=conn.createStatement（）;<BR> <WBR> <WBR> <WBR> sql="select *
from city order by locationid asc";<BR> <WBR> <WBR> <WBR>
rs=stmt.executeQuery(sql);<BR> <WBR> <WBR> }catch(SQLException
e){<BR> <WBR> <WBR> <WBR>
System.out.println(e.getMessage());<BR> <WBR> <WBR>
}<BR> <WBR> <WBR><BR>%><BR><script
language="javascript"><BR>var onecount;<BR>onecount=0;<BR>subcat=new
Array();<BR><%<BR>count=0;<BR>while(rs.next()){<BR> <WBR>%><BR> <WBR>subcat[<%=count%>]=new
Array("<%=rs.getString("districtname")%>","<%=rs.getInt("locationid")%>","<%=rs.getInt("districtid")%>");<BR> <WBR><%<BR> <WBR>count
= count + 1 ;</P>
<P>}<BR>rs.close();<BR>rs=null;<BR>%><BR>onecount=<%=count%>;<BR>function
changelocation(locationid){<BR>document.myform.smalllocation.length=0;<BR>var
locationid=locationid;<BR>var i;<BR>document.myform.smalllocation.options[0]=new
Option('==所选城市的地区==','');<BR>for(i=0;i<onecount;i++){<BR>if (subcat[i][1] ==
locationid)<BR>{<BR>document.myform.smalllocation.options[document.myform.smalllocation.length]
= new Option(subcat[i][0], subcat[i][2]);<BR>}<BR>}</P>
<P> <WBR> <WBR><BR>}<BR></script><BR><%<BR> <WBR>sql="select
* from village order by districtid
asc";<BR> <WBR>rs2=stmt.executeQuery(sql);<BR>%><BR><script
language="javascript"><BR>var onecount2;<BR>onecount2=0;<BR>subcat2=new
Array();<BR><%<BR>count2=0;<BR>while(rs2.next()){<BR> <WBR>%><BR> <WBR>subcat2[<%=count2%>]=new
Array("<%=rs2.getString("villagename")%>","<%=rs2.getInt("districtid")%>","<%=rs2.getInt("villageid")%>");<BR> <WBR><%<BR> <WBR>count2
= count2 + 1 ;</P>
<P>}<BR>rs2.close();<BR>rs2=null;<BR>%><BR>onecount2=<%=count2%>;<BR>function
changelocation2(districtid)<BR>{<BR>document.myform.village.length = 0;</P>
<P>var districtid=districtid;<BR>var j;<BR>document.myform.village.options[0] =
new Option('==所选地区的县区==','');<BR>for (j=0;j < onecount2;
j++)<BR>{<BR> <WBR> if (subcat2[j][1] ==
districtid)<BR> <WBR>{<BR> <WBR>
document.myform.village.options[document.myform.village.length] = new
Option(subcat2[j][0], subcat2[j][2]);<BR> <WBR> }<BR>}</P>
<P>}<BR></script></P>
<P></head><BR><body><BR><form name="myform"
method="post"><BR>分类：<select name="biglocation"
onChange="changelocation(document.myform.biglocation.options[document.myform.biglocation.selectedIndex].value)"
size="1"><BR><option
selected>请选择你所在的省份</option><BR><%<BR> <WBR> sql ="select * from
province order by locationname asc";<BR> <WBR>rs1 =
stmt.executeQuery(sql);<BR> <WBR>while(rs1.next()){<BR> <WBR>%><BR> <WBR><option
value="<%=rs1.getInt("locationid")%>"><%=rs1.getString("locationname")%></option></P>
<P> <WBR><%
}<BR> <WBR><BR> <WBR><BR> <WBR>rs1.close();<BR> <WBR>rs1 =
null;<BR> <WBR>conn.close();<BR> <WBR>conn =null;</P>
<P><BR>%><BR></select><select name="smalllocation"
onChange="changelocation2(document.myform.smalllocation.options[document.myform.smalllocation.selectedIndex].value)"><BR><option
selected value="">==所有地区==</option><BR></select><select
name="village" size="1"><BR><option
selected>==所有县区==</option><BR></select><BR></form></P>
<P></body><BR></html></P>
<P> <WBR></P>
<P>文章来源Google,版权属原作者。</P></DIV>
<DIV class=articleInfo>已投稿到： <!--（<a href="http://my2008.sina.com.cn/blog/rule.html" target="_blank">规则</a>）<span class="space12"></span>（<a href="#" onclick="return false;"><span onclick="showMyRecord();">积分</span></a>） <span class="space12"></span>//--><SPAN
class=sort><A href="http://blog.sina.com.cn/lm/114/113/day.html"
target=_blank>排行榜</A></SPAN> <SPAN class=group><A
href="http://q.sina.com.cn/blog_groups.php?fid=4fb5250d0100b8ye"
target=_blank>圈子</A></SPAN> </DIV>
<DIV class=articleUtil>
<DIV class=floatRight><A
href="http://blog.sina.com.cn/s/blog_4fb5250d0100b8ye.html#comment">评论</A><SPAN
class=sub id=c_4fb5250d0100b8ye>(0)</SPAN><SPAN class=space>|</SPAN> <A>阅读</A>
<SPAN class=sub id=r_4fb5250d0100b8ye>(0)</SPAN> <SPAN class=space>|</SPAN> <A
id=f_4fb5250d0100b8ye
onclick="$articleManage('4fb5250d0100b8ye',5);return false;"
href="http://blog.sina.com.cn/s/">收藏</A> <SPAN class=sub
id=fn_4fb5250d0100b8ye>(0)</SPAN> <SPAN class=space>|</SPAN> <A
id=s_4fb5250d0100b8ye onclick="addShare('4fb5250d0100b8ye');return false;"
href="http://blog.sina.com.cn/s/">分享</A> <SPAN class=space>|</SPAN> <A
href="http://blog.sina.com.cn/main_v5/ria/print.html?blog_id=blog_4fb5250d0100b8ye"
target=_blank>打印</A> <SPAN class=space>|</SPAN> <A id=q_4fb5250d0100b8ye
onclick="window.open('http://control.blog.sina.com.cn/admin/advice/impeach.php?url=4fb5250d0100b8ye' , '', 'height=495, width=510, left=' + (window.screen.width-538)/2 + ',top=' + (window.screen.height-525)/2, toolbar='no', menubar='no', scrollbars='no', resizable='no' , status='no');return false;"
href="javascript:;">举报</A> </DIV></DIV>
<DIV class=articleContext>前一篇：<SPAN class=space6></SPAN><A
onclick="v5SendLog('v5_one','rela_nextarticle');"
href="http://blog.sina.com.cn/s/blog_4fb5250d01009sar.html">新版招生网上线</A><BR>后一篇：<SPAN
class=space6></SPAN><A onclick="v5SendLog('v5_one','rela_prevarticle');"
href="http://blog.sina.com.cn/s/blog_4fb5250d0100b9cw.html">学习Java CSDN 的经典老贴整理</A>
</DIV>
<DIV class="sinaPlan SinaAd_hide" id=advertise_bottom></DIV>
<DIV class=comment id=blogCommentArea>
<DIV class=commentBar><SPAN class=floatLeft><SPAN class=title>评论</SPAN><SPAN
class=my2008 id=COMMENT_FIRST_HOT></SPAN></SPAN> <SPAN class=floatRight><A
href="http://blog.sina.com.cn/s/blog_4fb5250d0100b8ye.html#post">发表评论</A></SPAN>
</DIV>
<DIV class=commentContent><A name=comment></A>
<DIV id=commentContent></DIV>
<DIV class=commentBottom id=commentPaging></DIV><!-- <div class="sinaPlan"> <span class="floatLeft title hot"></span> <span class="floatRight manage"><a href="#"></a></span> </div> --><A
name=post></A>
<DIV class=commentBar><SPAN class=floatLeft><SPAN class=title>发表评论</SPAN><SPAN
id=COMMENT_HOT></SPAN></SPAN> </SPAN></DIV>
<DIV class=sendComment>
<TABLE width=640>
<TBODY>
<TR>
<TD class=info align=left><SPAN id=comment_login_form
style="DISPLAY: none">登录名：<INPUT class=username id=login_name>密码：<INPUT
class=password id=login_pass type=password><A
href="http://login.sina.com.cn/getpass.html" target=_blank>找回密码</A> <A
href="http://login.sina.com.cn/hd/reg.php?entry=space"
target=_blank>注册新浪通行证</A></SPAN> <SPAN id=comment_wel></SPAN><SPAN
id=anonymity_wel style="DISPLAY: none">昵称:<INPUT class=username
id=anonymity_name value=新浪网友></SPAN> </TD>
<TD align=right><SPAN id=comment_anon><INPUT id=anonymity type=checkbox
value="" name="">匿名评论(无需注册)</SPAN> </TD></TR></TBODY></TABLE>
<DIV id=emotioins></DIV><TEXTAREA class=commentArea id=commentArea></TEXTAREA>
<DIV>验证码：<INPUT class=checkwd id=login_check><IMG id=comment_check_img
alt=看不清楚数字吗？点击这里再试试。
src="用JSP实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.files/checkwd_image.png" align=absMiddle
border=0><SPAN id=audioCheckCon></SPAN></DIV>
<DIV class=sendBut><INPUT class="but_all but_3" id=comment_post_btn type=submit value=发评论>
</DIV></DIV></DIV></DIV></DIV>
<DIV class=componentBottom></DIV></DIV></DIV></DIV>
<DIV class=clear ?></DIV></DIV>
<DIV class=sinaBottom>
<CENTER><A href="http://control.blog.sina.com.cn/admin/advice/advice_list.php"
target=_blank>新浪BLOG意见反馈留言板</A> <A
onclick="window.open ('http://control.blog.sina.com.cn/admin/advice/impeach.php?url=' + escape(document.location.href), '', 'height=495, width=510, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no');"
href="javascript:;">不良信息反馈</A> 电话：95105670 提示音后按2键（按当地市话标准计费） 欢迎批评指正 </CENTER>
<P><A href="http://corp.sina.com.cn/chn/" target=_blank>新浪简介</A> | <A
href="http://corp.sina.com.cn/eng/" target=_blank>About Sina</A> | <A
href="http://ads.sina.com.cn/" target=_blank>广告服务</A> | <A
href="http://www.sina.com.cn/contactus.html" target=_blank>联系我们</A> | <A
href="http://corp.sina.com.cn/chn/sina_job.html" target=_blank>招聘信息</A> | <A
href="http://www.sina.com.cn/intro/lawfirm.shtml" target=_blank>网站律师</A> | <A
href="http://english.sina.com/" target=_blank>SINA English</A> | <A
href="http://members.sina.com.cn/apply/" target=_blank>会员注册</A> | <A
href="http://tech.sina.com.cn/focus/sinahelp.shtml" target=_blank>产品答疑</A> </P>
<P class=copyright>Copyright © 1996 - 2008 SINA Corporation, All Rights Reserved
<BR></P>
<DIV>新浪公司 <A href="http://www.sina.com.cn/intro/copyright.shtml"
target=_blank>版权所有</A></DIV></DIV></DIV><SPAN style="DISPLAY: none" expara=""
url="http://blog.sina.com.cn/s/blog_4fb5250d0100b8ye.html"
key="4fb5250d0100b8ye" pid="1" name="pvcounter"></SPAN>
<SCRIPT id=PVCOUNTER_FORIE type=text/javascript></SCRIPT>
<SCRIPT src="用JSP实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.files/pvcounter.js"
type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>loadResource();</SCRIPT>
<SCRIPT type=text/javascript>renderBlog();</SCRIPT>
<SCRIPT src="" type=text/javascript charset=utf-8></SCRIPT>
<SCRIPT src="用JSP实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.files/680.js"
type=text/javascript></SCRIPT>
<SCRIPT language=javascript>
if($UID!=null)
{
dwScript({url:"http://v.space.sina.com.cn/visitor/add.php?prod=1&uid=" + $uid + "&vid=" + $UID + "&var=newVisitor"});
}
</SCRIPT>
<!-- SUDA_CODE_START -->
<SCRIPT src="用JSP实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.files/suda_s_v851c.js"
type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
//<!--
try{
var config_pic = config?(config.s?((config.s.head || config.s.head)?((config.s.head.usepic || config.s.bg.usepic)?((config.s.head.usepic=='1')||(config.s.bg.usepic=='1')?1:0):0):0):0):0;
_S_pSt(_S_PID_,config.s.t,config.s.r+","+config_pic);
}catch(e){}
//-->
</SCRIPT>
<!-- SUDA_CODE_END --><!-- START WRating v1.0 -->
<SCRIPT src="用JSP实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.files/a1.js"
type=text/javascript></SCRIPT>
<SCRIPT type=text/javascript>
try{
var vjAcc="860010-0328010000";
var wrUrl="http://sina.wrating.com/";
vjTrack("");
}catch(e){};
</SCRIPT>
<NOSCRIPT><IMG style="DISPLAY: none" height=1 src="" width=1></NOSCRIPT> <!-- END WRating v1.0 --><!-- BLOG_CODE_START -->
<SCRIPT language=javascript src="用JSP实现下拉列表框三级联动效果_水云轩电脑工作室_新浪博客.files/a.js"
type=text/javascript></SCRIPT>
<!-- BLOG_CODE_END --></BODY></HTML>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -