好资源导航 » 文章资讯 » Ajax实现二级联动菜单

Ajax实现二级联动菜单

2023-08-05 08:15:04 64

本文实例为大家分享了Ajax二级联动菜单的具体代码，供大家参考，具体内容如下

index.jsp

<%@pagelanguage="java"pageEncoding="UTF-8"%>


二级菜单联动演示

varreq;
window.οnlοad=function()
{//页面加载时的函数
}

functionChange_Select(){//当第一个下拉框的选项发生改变时调用该函数
varprovince=document.getElementById('province').value;
varurl="select?id="+escape(province);
if(window.XMLHttpRequest){
req=newXMLHttpRequest();
}elseif(window.ActiveXObject){
req=newActiveXObject("Microsoft.XMLHTTP");
}
if(req){
req.open("GET",url,true);
//指定回调函数为callback
req.onreadystatechange=callback;
req.send(null);
}
}
//回调函数
functioncallback(){
if(req.readyState==4){
if(req.status==200){
parseMessage();//解析XML文档
}else{
alert("不能得到描述信息:"+req.statusText);
}
}
}
//解析返回xml的方法
functionparseMessage(){
varxmlDoc=req.responseXML.documentElement;//获得返回的XML文档
varxSel=xmlDoc.getElementsByTagName('select');
//获得XML文档中的所有标记中的第二个标记的值,也就是标记的值

varoption=newOption(xText,xValue);
//根据每组value和text标记的值创建一个option对象

try{
select_root.add(option);//将option对象添加到第二个下拉框中
}catch(e){
}
}
}









二级联动示例







请选择


北京


天津


山东





请选择

SelectServlet.java

packagecom;

importjava.io.IOException;

importjavax.servlet.ServletException;
importjavax.servlet.http.HttpServlet;
importjavax.servlet.http.HttpServletRequest;
importjavax.servlet.http.HttpServletResponse;
/***
*
*@authorzdw
*
*/
publicclassSelectServletextendsHttpServlet
{

privatestaticfinallongserialVersionUID=1L;

publicSelectServlet()
{
super();
}

publicvoiddestroy()
{
super.destroy();
}

publicvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)
throwsServletException,IOException
{
//response.setCharacterEncoding("GBK");
response.setContentType("text/xml");
response.setHeader("Cache-Control","no-cache");
request.setCharacterEncoding("GBK");
response.setCharacterEncoding("UTF-8");
StringtargetId=request.getParameter("id").toString();
System.out.println(targetId);
//获得请求中参数为id的值
Stringxml_start="";
Stringxml_end="";
Stringxml="";

if(targetId.equalsIgnoreCase("0"))
{
xml="";
}elseif(targetId.equalsIgnoreCase("1"))
{
xml="";
xml+="";
xml+="";
xml+="";
}elseif(targetId.equalsIgnoreCase("2"))
{
xml="";
xml+="";
xml+="";
xml+="";
}else
{//如果是3,则返回下面的字符
xml="";
xml+="";
xml+="";
xml+="";
}

Stringlast_xml=xml_start+xml+xml_end;
response.getWriter().write(last_xml);

}

publicvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)
throwsServletException,IOException
{
doGet(request,response);
}

publicvoidinit()throwsServletException
{
}

}

web.xml




SelectServlet
com.SelectServlet



SelectServlet
/select


index.jsp

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
514930285
czq8825@qq.com

Ajax实现二级联动菜单

热门推荐

随机推荐