二次元同好交流新大陆
扫码下载App
温馨提示！由于新浪微博认证机制调整，您的新浪微博帐号绑定已过期，请重新绑定！&&|&&
LOFTER精选
网易考拉推荐
用微信&&“扫一扫”
将文章分享到朋友圈。
用易信&&“扫一扫”
将文章分享到朋友圈。
阅读(4382)|
用微信&&“扫一扫”
将文章分享到朋友圈。
用易信&&“扫一扫”
将文章分享到朋友圈。
历史上的今天
loftPermalink:'',
id:'fks_',
blogTitle:'jQuery Ajax 二级联动下拉菜单例子(IE/火狐FF)',
blogAbstract:'
二级联动下拉菜单，可以说是Ajax的经典应用了。
我们用一个根据地区选择学校的例子来说明。
二级联动下拉菜单
介绍一下要准备的文件，一共3个。
ajax_test.html：主要操作页面，在这里显示二级联动下拉菜单；
get_local.php：取得地区名称的后台页面，返回所有的地区名称；
get_school.php：取得学校名称的后台页面，接受地区名称和转码参数，返回该地区的学校名称。
数据库的结构：表：school字段：id,local,school
代码：ajax_test.html
&!DOCTYPE',
blogTag:'',
blogUrl:'blog/static/',
isPublished:1,
istop:false,
modifyTime:1,
publishTime:1,
permalink:'blog/static/',
commentCount:0,
mainCommentCount:0,
recommendCount:0,
bsrk:-100,
publisherId:0,
recomBlogHome:false,
currentRecomBlog:false,
attachmentsFileIds:[],
groupInfo:{},
friendstatus:'none',
followstatus:'unFollow',
pubSucc:'',
visitorProvince:'',
visitorCity:'',
visitorNewUser:false,
postAddInfo:{},
mset:'000',
remindgoodnightblog:false,
isBlackVisitor:false,
isShowYodaoAd:true,
hostIntro:'',
hmcon:'0',
selfRecomBlogCount:'0',
lofter_single:''
{list a as x}
{if x.moveFrom=='wap'}
{elseif x.moveFrom=='iphone'}
{elseif x.moveFrom=='android'}
{elseif x.moveFrom=='mobile'}
${a.selfIntro|escape}{if great260}${suplement}{/if}
{list a as x}
推荐过这篇日志的人：
{list a as x}
{if !!b&&b.length>0}
他们还推荐了：
{list b as y}
转载记录：
{list d as x}
{list a as x}
{list a as x}
{list a as x}
{list a as x}
{if x_index>4}{break}{/if}
${fn2(x.publishTime,'yyyy-MM-dd HH:mm:ss')}
{list a as x}
{if !!(blogDetail.preBlogPermalink)}
{if !!(blogDetail.nextBlogPermalink)}
{list a as x}
{if defined('newslist')&&newslist.length>0}
{list newslist as x}
{if x_index>7}{break}{/if}
{list a as x}
{var first_option =}
{list x.voteDetailList as voteToOption}
{if voteToOption==1}
{if first_option==false},{/if}&&“${b[voteToOption_index]}”&&
{if (x.role!="-1") },“我是${c[x.role]}”&&{/if}
&&&&&&&&${fn1(x.voteTime)}
{if x.userName==''}{/if}
网易公司版权所有&&
{list x.l as y}
{if defined('wl')}
{list wl as x}{/list}当前位置： →
→ Ajax兑现二级联动菜单
Ajax兑现二级联动菜单
& 作者：佚名 & 来源： 互联网 & 热度：
&收藏到→_→：
摘要: Ajax实现二级联动菜单index.jsp: &%@&page&language=&java&&pageEncoding=&UTF-8&%&gt...
"Ajax兑现二级联动菜单"：：
ajax实现二级联动菜单index.jsp:
&%@&page&language=&java&&pageencoding=&utf-8&%&
&&&&&head&
&&&&&&&&&title&二级菜单联动演示&/title&
&&&&&&&&&script&type=&text/javascript&&
&&&&window.onload=function()
&&&&{//页面加载时的函数
&&&&function&change_select(){//当第一个下拉框的选项发生改变时调用该函数
&&&&&&var&province&=&document.getelementbyid('province').
&&&&&&var&url&=&&select?id=&+&escape(province);
&&&&&&if(window.xmlhttprequest){
&&&&&&&&req&=&new&xmlhttprequest();
&&&&&&}else&if(window.activexobject){
&&&&&&&&req&=&new&activexobject(&microsoft.xmlhttp&);
&&&&&&if(req){
&&&&&&&&req.open(&get&,url,true);
&&&&&&&&&//指定回调函数为callback
&&&&&&&&req.onreadystatechange&=&
&&&&&&&&req.send(null);
&&&&//回调函数
&&&&function&callback(){
&&&&&&if(req.readystate&==4){
&&&&&&&&if(req.status&==200){
&&&&&&&&&&parsemessage();//解析xml文档
&&&&&&&&}else{
&&&&&&&&&&alert(&不能得到描述信息:&&+&req.statustext);
&&&&//解析返回xml的方法
&&&&function&parsemessage(){
&&&&&&var&xmldoc&=&req.responsexml.//获得返回的xml文档
&&&&&&var&xsel&=&xmldoc.getelementsbytagname('select');
&&&&&&//获得xml文档中的所有&select&标记
&&&&&&var&select_root&=&document.getelementbyid('city');
&&&&&&//获得网页中的第二个下拉框
&&&&&&select_root.options.length=0;
&&&&&&//每次获得新的数据的时候先把每二个下拉框架的长度清0
&&&&&&for(var&i=0;i&xsel.i++){
&&&&&&&&var&xvalue&=&xsel[i].childnodes[0].firstchild.
&&&&&&&&//获得每个&select&标记中的第一个标记的值,也就是&value&标记的值
&&&&&&&&var&xtext&=&xsel[i].childnodes[1].firstchild.
&&&&&&&&//获得每个&select&标记中的第二个标记的值,也就是&text&标记的值
&&&&&&&&var&option&=&new&option(xtext,&xvalue);
&&&&&&&&//根据每组value和text标记的值创建一个option对象
&&&&&&&&try{
&&&&&&&&&&select_root.add(option);//将option对象添加到第二个下拉框中
&&&&&&&&}catch(e){
&&&&}&&&&&&&&
&&&/script&
&&&&&/head&
&&&&&body&
&&&&&&&&&div&align=&center&&
&&&&&&&&&&&&&form&name=&form1&&method=&post&&action=&&&
&&&&&&&&&&&&&&&&&table&width=&70%&&border=&0&&cellspacing=&0&&cellpadding=&0&&
&&&&&&&&&&&&&&&&&&&&&tr&
&&&&&&&&&&&&&&&&&&&&&&&&&td&align=&center&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&二级联动示例
&&&&&&&&&&&&&&&&&&&&&&&&&/td&
&&&&&&&&&&&&&&&&&&&&&/tr&
&&&&&&&&&&&&&&&&&&&&&tr&
&&&&&&&&&&&&&&&&&&&&&&&&&td&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&select&name=&province&&id=&province&&onchange=&change_select()&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&!--第一个下拉菜单--&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&option&value=&0&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&请选择
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&option&value=&1&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&北京
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&option&value=&2&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&天津
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&option&value=&3&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&山东
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/select&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&select&name=&city&&id=&city&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&!--第二个下拉菜单--&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&option&value=&0&&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&请选择
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/option&
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&/select&
&&&&&&&&&&&&&&&&&&&&&&&&&/td&
&&&&&&&&&&&&&&&&&&&&&/tr&
&&&&&&&&&&&&&&&&&&&&&tr&
&&&&&&&&&&&&&&&&&&&&&&&&&td&
&&&&&&&&&&&&&&&&&&&&&&&&&/td&
&&&&&&&&&&&&&&&&&&&&&tr&
&&&&&&&&&&&&&&&&&/table&
&&&&&&&&&&&&&/form&
&&&&&&&&&/div&
&&&&&/body&
selectservlet:
import&java.io.
import&javax.servlet.
import&javax.servlet.http.
import&javax.servlet.http.
import&javax.servlet.http.
&*&@author&zdw
public&class&selectservlet&extends&httpservlet
&&&&private&static&final&long&serialversionuid&=&<span style="color:#l;
&&&&public&selectservlet()
&&&&&&&&super();
&&&&public&void&destroy()
&&&&&&&&super.destroy();
&&&&public&void&doget(httpservletrequest&request,&httpservletresponse&response)
&&&&&&&&&&&&throws&servletexception,&ioexception
//&&&&&&&&response.setcharacterencoding(&gbk&);
&&&&&&&&response.setcontenttype(&text/xml&);
&&&&&&&&response.setheader(&cache-control&,&&no-cache&);
&&&&&&&&request.setcharacterencoding(&gbk&);
&&&&&&&&response.setcharacterencoding(&utf-8&);
&&&&&&&&string&targetid&=&request.getparameter(&id&).tostring();
&&&&&&&&system.out.println(targetid);
&&&&&&&&//&获得请求中参数为id的&#20540;
&&&&&&&&string&xml_start&=&&&selects&&;
&&&&&&&&string&xml_end&=&&&/selects&&;
&&&&&&&&string&xml&=&&&;
&&&&&&&&if&(targetid.equalsignorecase(&<span style="color:#&))
&&&&&&&&&&&&xml&=&&&select&&value&0&/value&&text&请选择&/text&&/select&&;
&&&&&&&&}&else&if&(targetid.equalsignorecase(&<span style="color:#&))
&&&&&&&&&&&&xml&=&&&select&&value&1&/value&&text&昌平&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&2&/value&&text&丰台&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&3&/value&&text&海淀&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&4&/value&&text&朝阳&/text&&/select&&;
&&&&&&&&}&else&if&(targetid.equalsignorecase(&<span style="color:#&))
&&&&&&&&&&&&xml&=&&&select&&value&1&/value&&text&塘沽区&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&2&/value&&text&汉沽区&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&3&/value&&text&大港区&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&4&/value&&text&东丽区&/text&&/select&&;
&&&&&&&&}&else
&&&&&&&&{//&如果是3,则返回下面的字符
&&&&&&&&&&&&xml&=&&&select&&value&1&/value&&text&济南&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&2&/value&&text&青岛&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&3&/value&&text&淄博&/text&&/select&&;
&&&&&&&&&&&&xml&&#43;=&&&select&&value&4&/value&&text&枣庄&/text&&/select&&;
&&&&&&&&string&last_xml&=&xml_start&&#43;&xml&&#43;&xml_
&&&&&&&&response.getwriter().write(last_xml);
&&&&public&void&dopost(httpservletrequest&request,&httpservletresponse&response)
&&&&&&&&&&&&throws&servletexception,&ioexception
&&&&&&&&doget(request,&response);
&&&&public&void&init()&throws&servletexception
&?xml&version=&1.0&&encoding=&utf-8&?&
&web-app&version=&2.4&&xmlns=&/xml/ns/j2ee&
&&&&xmlns:xsi=&http://www.w3.org/2001/xmlschema-instance&
&&&&xsi:schemalocation=&/xml/ns/j2ee&
&&&&/xml/ns/j2ee/web-app_2_4.xsd&&
&&&&&servlet&
&&&&&&&&&servlet-name&selectservlet&/servlet-name&
&&&&&&&&&servlet-class&com.selectservlet&/servlet-class&
&&&&&/servlet&
&&&&&servlet-mapping&
&&&&&&&&&servlet-name&selectservlet&/servlet-name&
&&&&&&&&&url-pattern&/select&/url-pattern&
&&&&&/servlet-mapping&
&&&&&welcome-file-list&
&&&&&&&&&welcome-file&index.jsp&/welcome-file&
&&&&&/welcome-file-list&
&/web-app&
搜索此文相关文章：此文来自: 马开东博客
网址: 站长QQ
上一篇：没有了
Ajax兑现二级联动菜单_Ajax相关文章
Ajax_总排行榜
Ajax_月排行榜
Ajax_周排行榜
Ajax_日排行榜
马开东博客专栏
企业软件/开发
硬件/嵌入开发
马开东博客专栏
应用服务器
软件工程/管理/测试
马开东博客专栏
Linux/Unix
马开东博客专栏
开发语言/框架
专题开发/技术/项目
马开东博客专栏
高性能开发
马开东博客专栏&&&&ssh+ajax的二级下拉菜单
&ssh+ajax的二级下拉菜单
里面集成struts2+spring+hibernate注解,使用mysql数据库，来进行二级下拉，sql文件也在里面，供大家参考，不喜勿喷。个人也花了1个小时研究写出来的。
若举报审核通过，可奖励20下载分
被举报人：
chenzhanglei68
举报的资源分：
请选择类型
资源无法下载
资源无法使用
标题与实际内容不符
含有危害国家安全内容
含有反动色情等内容
含广告内容
版权问题，侵犯个人或公司的版权
*详细原因：
VIP下载&&免积分60元/年（1200次）
您可能还需要
Q.为什么我点的下载下不了，但积分却被扣了
A. 由于下载人数众多，下载服务器做了并发的限制。若发现下载不了，请稍后再试，多次下载是不会重复扣分的。
Q.我的积分不多了，如何获取积分？
A. 获得积分，详细见。
完成任务获取积分。
论坛可用分兑换下载积分。
第一次绑定手机，将获得5个C币，C币可。
关注并绑定CSDNID，送10个下载分
下载资源意味着您已经同意遵守以下协议
资源的所有权益归上传用户所有
未经权益所有人同意，不得将资源中的内容挪作商业或盈利用途
CSDN下载频道仅提供交流平台，并不能对任何下载资源负责
下载资源中如有侵权或不适当内容，
本站不保证本站提供的资源的准确性，安全性和完整性，同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
开发技术下载排行
您当前C币：0&&&可兑换 0 下载积分
兑换下载分:&
消耗C币:0&
立即兑换&&
兑换成功你当前的下载分为 。前去下载资源
你下载资源过于频繁，请输入验证码
如何快速获得积分？
你已经下载过该资源，再次下载不需要扣除积分
ssh+ajax的二级下拉菜单
所需积分：1
剩余积分：0
扫描微信二维码精彩活动、课程更新抢先知
VIP会员，免积分下载
会员到期时间：日
剩余下载次数：1000
ssh+ajax的二级下拉菜单
剩余次数：&&&&有效期截止到：
你还不是VIP会员VIP会员享免积分 . 专属通道极速下载
VIP下载次数已满VIP会员享免积分 . 专属通道极速下载，请继续开通VIP会员
你的VIP会员已过期VIP会员享免积分 . 专属通道极速下载，请继续开通VIP会员求助 ：ajax
二级级联菜单 数据库中调取
[问题点数：40分，结帖人mixiao25184]
求助 ：ajax
二级级联菜单 数据库中调取
[问题点数：40分，结帖人mixiao25184]
不显示删除回复
显示所有回复
显示星级回复
显示得分回复
只显示楼主
本帖子已过去太久远了，不再提供回复功能。}