javascrpt实现联动下拉框(非ajax)

 数据库

编码id   id;

编码名称    name;

编码上级id   parentid;

把所有数据引入数组中  以及对应的查询函数

<script language="javascript">

function loadPage(obj){   var str;   var obj1 = frm.ti;   var obj2 = frm.s;   var first=frm.first;   var second=frm.second;   str = "&ti="+obj1.value+"&s="+obj2.value+"&first="+first.value+"&second="+second.value;   this.document.location.href="wjMgr.jsp?pages=" + obj.options[obj.selectedIndex].value+str;}function loadPage2(){   var str;   var obj1 = frm.ti;   var obj2 = frm.s;   var first=frm.first;   var second=frm.second;   str = "&ti="+obj1.value+"&s="+obj2.value+"&first="+first.value+"&second="+second.value;   this.document.location.href="wjMgr.jsp?pages=1"+str;}function loadPage1(n){   var str;   var obj1 = frm.ti;   var obj2 = frm.s;   var first=frm.first;   var second=frm.second;   str = "&ti="+obj1.value+"&s="+obj2.value+"&first="+first.value+"&second="+second.value;   this.document.location.href="wjMgr.jsp?pages="+n+str;}

var typeArray = new Array();var tanum = 0;<%Table tb = new Table();Vector vc = null;Hashtable rows = new Hashtable();String sql = "";String t1="";int t3=0,t4=0;sql = "select id,name,parentid from inweb_downclass ";vc = tb.getContent(sql);if(vc.size()>0){for(int i=0;i<vc.size();i++){rows = (Hashtable)vc.get(i);t3 = ((Integer)rows.get("id")).intValue();t1 = (String)rows.get("name");t4 = ((Integer)rows.get("parentid")).intValue();%>typeArray[<%=i%>]=new Array('<%=t3%>','<%=t1%>','<%=t4%>');<%}}%>tanum = "<%=vc.size()%>";</script>

得到默认的三级联动下拉框的值

 

<%String ti = Util.getRequestStr(request,"ti","");int s = Util.getRequestInt(request,"s",0);int first = Util.getRequestInt(request,"first",0);int second = Util.getRequestInt(request,"second",0);  int uid = 0;   int num = 1;String t = "";String d = "";String sname = "";   if(second!=0){sql="select id,name,parentid  from inweb_downclass where id="+second;vc=tb.getContent(sql);if(vc.size()!=0){rows = (Hashtable)vc.get(0);first = ((Integer)rows.get("parentid")).intValue();}}if(first!=0){sql="select id,name,parentid  from inweb_downclass where id="+first;vc=tb.getContent(sql);if(vc.size()!=0){rows = (Hashtable)vc.get(0);s = ((Integer)rows.get("parentid")).intValue();}}int type=s;if(second!=0){type=second;}else{if(first!=0){type=first;}}%>

 

联动菜单

      <input type="button" class="input" value="新增文件" onclick="location.href='wjMgr_add.jsp'">       名称：<input type="text" class="input" name="ti" size="20" value="<%=ti%>">      类别： <!-- 默认第一层类别的内容 -->      <select name="s" onchange="chgb(this.options[this.selectedIndex].value);">      <option value=0>----选择----</option>      <%      sql="select id,name,parentid  from inweb_downclass where id in (60,6,7,74,37)";      vc=tb.getContent(sql);      for(int i=0;i<vc.size();i++){      rows = (Hashtable)vc.get(i);  uid = ((Integer)rows.get("id")).intValue();      t = (String)rows.get("name");  %>  <option value="<%=uid %>"  <%if(s==uid){%>selected<%}%>  ><%=t %></option>  <%}%>            </select>       <!-- 默认第二层类别的内容 -->      <select name="first" onchange="chgba(this.options[this.selectedIndex].value);">      <option value=0>----选择----</option>      <%      if(first!=0){      sql="select id,name,parentid  from inweb_downclass where parentid="+s;      vc=tb.getContent(sql);      for(int i=0;i<vc.size();i++){      rows = (Hashtable)vc.get(i);  uid = ((Integer)rows.get("id")).intValue();      t = (String)rows.get("name");  %>  <option value="<%=uid %>"  <%if(first==uid){%>selected<%}%>  ><%=t %></option>  <%}}%>            </select>       <!-- 默认第三层类别的内容 -->      <select name="second">      <option value=0>----选择----</option>      <%      if(second!=0){      sql="select id,name,parentid  from inweb_downclass where parentid="+first;      vc=tb.getContent(sql);      for(int i=0;i<vc.size();i++){      rows = (Hashtable)vc.get(i);  uid = ((Integer)rows.get("id")).intValue();      t = (String)rows.get("name");  %>  <option value="<%=uid %>"  <%if(second==uid){%>selected<%}%>  ><%=t %></option>  <%}}%>      </select>                  <input type="button" class="input" value=" 查询 " onclick="loadPage2();">

 

联动触发js函数

 

<script language="javascript">function chgb(s){  frm.first.length=0;  //初始化 分类下拉框  frm.first.options[0]=new Option('---选择---','0');  for(i=0;i<tanum;i++){    if(typeArray[i][2]==s){   //如果是下级分类，加入这个分类      frm.first.options[frm.first.length]=new Option(typeArray[i][1],typeArray[i][0]);    }  } }function chgba(s){  frm.second.length=0;  //初始化 分类下拉框  frm.second.options[0]=new Option('---选择---','0');  for(i=0;i<tanum;i++){    if(typeArray[i][2]==s){   //如果是下级分类，加入这个分类      frm.second.options[frm.second.length]=new Option(typeArray[i][1],typeArray[i][0]);    }  } }</script>