高手请进-jsp中联动下拉列表（高分）

如果数据不多的话。可以用下面的方式。
var ary1 = new Array("a","b");
var ary2 = new Array(new Array("a1","a2"),new Array("b1","b2","b3"));
function changeSelect(name1,name2){
var obj1 =document.getElementById(name1);
var obj2 =document.getElementById(name2);
var outHtml = "";
                  var intIndex = 0;
                  for(var i=0;i<ary1.length;i++){
                      if(ary1[i]==obj1.value){
                          intIndex = i;
                          break;
                      }
                  }
if(ary2[intIndex].length == 1){

outHtml += "<LABEL id='"+name2+"'MAXLENGTH=\"4\">";
outHtml += ary2[obj1Index][0]+"<INPUT type=\"hidden\" name=\""+name2+"\" value=\""+ary2[obj1Index][0]+"\"></LABEL>"; }else{
outHtml = "<SELECT id='"+name2+"' name='"+name2+"' onchange=\"javascript:document.getElementById('hd_SentakuSeikyuzuki').value=this.value\">";
for(var i=0;i<ary2[obj1Index].length;i++){
outHtml += "<OPTION value='"+ary2[obj1Index][i]+"' lang='ja'>"+ary2[obj1Index][i]+"</OPTION>";
}
outHtml += "</SELECT>";
}
obj2.outerHTML = outHtml;

}

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

数据量比较大的话,应该在第一个下拉框改变的时候,提交form到服务器端检索，再返回来把检索的结果显示到第二个下拉框里。
你怎么信誉被扣分了，但我是个热心肠的人，无所谓你给不给分呢，呵呵。当初也有好多人帮了我
简单的其实可以一次读取出来，用JS，放到客户端的array里。下面是从动态从数据库里取，我以前用过，这是我最近的一个项目里用的，有所删节。:)
给你源代码：
用的是struts框架，siteList是一条条市的信息，默认是空的，而省默认是全都检索出来
支持两级联动,关键是通过一个内部帧来向后台请求数据，再通过JS塞进相关form元素
。在session里是复用的，请注意在一个session里只取一次数据。

<%@ page import="com.test.helper.aaa.Const"%>
<%@ page import="java.util.ArrayList"%><%
if(session.getAttribute("areaList")==null){
   try{
      ArrayList areaList = new Arraylist();
      //areaList里放的是从数据库里检索出来的一条条省的信息，是个DTO，是普通的java bean
      //加入检索出来的省
       areaList.addAll(Const.qryAreaList(null,regionId));
      //设置有效范围为整个session
      pageContext.setAttribute("areaList",areaList,3);
   }catch(Exception e){
     //e.printStackTrace();
     //不做任何提示操作，在页面上反映只是没有取到数据而已,select列表为空
   }
}
//siteList是一条条市的信息，默认是空的，而省默认是全都检索出来
if(session.getAttribute("siteList")==null){
   try{
      ArrayList siteList = new ArrayList();
      pageContext.setAttribute("siteList",siteList,3);
   }catch(Exception e){
     //e.printStackTrace();
     //不做任何提示操作，在页面上反映只是没有取到数据而已,select列表为空
   }
}
  String dataSrc="";
%><SCRIPT LANGUAGE="JavaScript">

function doChangeSite(formName,areaName,siteName) {
    var area = eval("document."+ formName +"."+ areaName);
    var dataSrc2 = "../include/getsitelist.jsp?areaId="+ area.value +"&formName="+formName + "&siteName="+siteName;
    document.all.getSiteData.src = dataSrc2;
}
</SCRIPT>
<iframe name="getSiteData" style='display:none;'></iframe>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ page import="com.test.helper.aaa.Const"%>
<%@ page import="java.util.ArrayList"%>
<%@ page import="com.test.dto.aaa.SiteDTO"%>
<%@ page contentType="text/html; charset=gb2312" %>
<html:html>
<html lang="true">
<head>
<meta http-equiv="Expires" CONTENT="0">
<meta http-equiv="Cache-Control" CONTENT="no-cache">
<meta http-equiv="aaa" CONTENT="no-cache">
</head>
<%
//may get it from session
int areaId = 0;
String formName="";
String siteName="";
//取得省id
if ((request.getParameter("areaId") != null) &&(request.getParameter("areaId").length() > 0)){
    areaId = Integer.parseInt(request.getParameter("areaId").trim());
}
//取得父页中的form name
if ((request.getParameter("formName") != null) &&(request.getParameter("formName").length() > 0)){
    formName = request.getParameter("formName").trim();
}
//取得父页中的市的select name
if ((request.getParameter("siteName") != null) &&(request.getParameter("siteName").length() > 0)){
    siteName = request.getParameter("siteName").trim();
}
  ArrayList arSiteList = new ArrayList();  try{
  //取到检索到所有的市
    arSiteList.addAll(Const.qrySiteListByAreaId(null,areaId));
    pageContext.setAttribute("siteList",arSiteList,3);
  } catch(Exception e){
     //不做任何提示操作，在页面上反映只是没有取到数据而已,select列表为空
  }
%>
<SCRIPT LANGUAGE="JavaScript">

function addOption(oSelect, value, text) {
    var oOption = document.createElement("OPTION");
    oOption.text = text;
    oOption.value = value;
    oSelect.add(oOption);
}

function addSiteOptions(formName,siteName) {
    var site = eval("parent.document."+ formName +"."+ siteName);
    site.length = 0;
    <%
      for (int i=0;i<arSiteList.size();i++) {
        SiteDTO  aSiteDTO =  (SiteDTO) arSiteList.get(i); %>
        addOption(site,'<%=aSiteDTO.getSite_id()%>','<%=aSiteDTO.getName()%>');
      <%}%>
   // alert("site.value:"+site.value);
}
//调用上述JS，添加当前省所属市
addSiteOptions('<%=formName%>','<%=siteName%>');
</SCRIPT>
</html:html>以上两个文件写好了，注意相关dto的编码，就是有getter、setter的普通bean具体使用两级联动的文件：
..................
<%@ include file= "../include/getarealist.jsp" %>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
..................  <tr>
          <td nowrap class="td_bluebg_txt">省</td>
          <td class="td_bluebg"><html:select property="PROVINCE" onchange="javascript:doChangeSite('entityForm','PROVINCE','CITY');" style="width:190px">
              <html:options collection="areaList" property="area_id"   labelProperty="name"/>
          </html:select></td>
  </tr>
  <tr>
          <td nowrap class="td_bluebg_txt">市</td>
          <td class="td_bluebg"><html:select property="CITY"  style="width:190px">
              <html:options collection="siteList" property="site_id"   labelProperty="name" />
          </html:select>
  </tr>要谢谢我的呀！
用xml好些，根据第一个下拉列表值，遍历第二个下拉列表的所有值，从而得到需要满足一定条件的下拉值显示在客户端。