紧急：100分求JSP+sql二级联动菜单！

此回复为自动发出,仅用于显示而已，并无任何其他特殊作用
楼主【mengxin123】截止到2008-06-25 11:08:17的历史汇总数据(不包括此帖)：
发帖数:9                  发帖分:230
结贴数:8                  结贴分:180
未结数:1                  未结分:50
结贴率:88.89 %            结分率:78.26 %
楼主加油

http://hi.baidu.com/blcx/blog/item/5f2a401065350affc3ce79a8.html
三级联动下拉查询都有。

分级菜单实现
---------------------------------------------------<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GB2312">
    <title>动态下拉菜单</title>
    <style type="text/css">
      a {text-decoration: none}
    </style>
    <link href="page/1.css" rel="stylesheet">
    <script language="javascript" src="page/2.js">
    </script>
  </head>
  <body OnLoad="InitMenu()" Onclick="HideMenu(menuBar)" ID="Bdy">
    
    <div Id="menuBar" class="menuBar" >
      <div Id="Bar1" class="Bar"  menu="menu1">新闻</div>
      <div Id="Bar2" class="Bar"  menu="menu2">体育</div>
      <div Id="Bar3" class="Bar"  menu="menu3">音乐</div>
      <div Id="Bar4" class="Bar"  menu="menu4">军事</div>
    </div>
    
    <div Id="menu1" class="menu" >
      <div Id="menuItem1_1" class="menuItem"  menu="menu6">国际</div>
      <div Id="menuItem1_2" class="menuItem"><a href=http://news.sina.com.cn/china/ target=_black>国内</a></div>
      <div Id="menuItem1_3" class="menuItem"><a href=http://news.sina.com.cn/people/ target=_black>其他</a></div>
    </div>
    
    <div Id="menu2" class="menu">
      <div Id="menuItem2_1" class="menuItem"><a href=http://f1.sina.com.cn/ target=_black>F 1赛事</a></div>
      <div Id="menuItem2_2" class="menuItem">NBA赛事</div>
      <div Id="menuItem2_3" class="menuItem">WCG赛事</div>
    </div>
    
    <div Id="menu3" class="menu">
      <div Id="menuItem3_1" class="menuItem">古典</div>
      <div Id="menuItem3_2" class="menuItem">摇滚</div>
      <div Id="menuItem3_3" class="menuItem">民俗</div>
      <div Id="menuItem3_4" class="menuItem" menu="menu5">流行</div>
    </div>
    
    <div Id="menu4" class="menu">
      <div Id="menuItem4_1" class="menuItem">时事</div>
      <div Id="menuItem4_2" class="menuItem">战史</div>
      <div Id="menuItem4_3" class="menuItem">兵器</div>
      <div Id="menuItem4_4" class="menuItem">兵法</div>
    </div>
    
    <div id="menu5" class="menu">
      <div Id="menuItem5_1" class="menuItem">国内</div>
      <div Id="menuItem5_2" class="menuItem">港台</div>
      <div Id="menuItem5_3" class="menuItem">欧美</div>
    </div>
    
    <div id="menu6" class="menu">
      <div Id="menuItem6_1" class="menuItem">时事动态</div>
      <div Id="menuItem6_2" class="menuItem">热点追踪</div>
      <div Id="menuItem6_3" class="menuItem" menu="menu7">时事点评</div>
    </div>
    
    <div id="menu7" class="menu">
      <div Id="menuItem7_1" class="menuItem">无</div>
      <div Id="menuItem7_2" class="menuItem">无</div>
      <div Id="menuItem7_3" class="menuItem">无</div>
    </div>
  </body>
</html>

4楼的虽然是静态的页面。但是换个角度来说。让你写SQL语句，动态的生成这些html没有问题吧
再加一个JavaScript的联动效果
循环显示出找出来的数据。就可以实现动态的联动了。当然了这个方法死板，写三级就麻烦死了。不过你就要的是２级

记得给分哦，我刚写针对你要求写的，看看你就会了
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
<二>一个下拉动态读取数据库
FOR:
1.
package Test;import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.Statement;import javax.servlet.http.HttpServletRequest;
import javax.servlet.jsp.JspWriter;import DBConnect.DBConn;public class Bumen {
public void getBumen(HttpServletRequest request,JspWriter out) {
        Connection conn = null;
        Statement stmt = null;
        ResultSet rs = null;         try {
            DBConn db = new DBConn();
            conn = db.getConnection();
            stmt = conn.createStatement();
            String sql = "select distinct bm_name from PJ_BM";
            rs = stmt.executeQuery(sql);
            String html ="";
            while (rs.next())
            {
                String bm_name=rs.getString("bm_name");
                out.print("<option>"+bm_name+"</option>");
            }
        } catch (Exception e) {
            e.getMessage();
        } finally {
            try {
                rs.close();
                stmt.close();
                conn.close();
            } catch (Exception e) {
                e.getMessage();
            }
        }
    }
}2.JSP
<td>
<select name="city">
<option>-请选择城市-</option>
          <%
            Bumen bm=new Bumen();
            bm.getBumen(request,out);
          %>
</select>
         </td>
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

6楼：我的qq：247637683，邮箱：[email protected] 谢谢！8楼：你的代码可以实现第一级菜单是从数据库取数据，这个我已经实现了，但是我还要选择一级菜单的时候，二级菜单的内容会跟着变。比如说，我选了xx分公司，这时候第二个下来框中的可选内容就从数据库中取出来。

学习。劳驾也给我来一个[email protected]

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ page import="java.lang.*,java.sql.*,java.text.*,java.io.*"%>
<jsp:useBean scope="page" id="OpenDB" class="dfbz.OpenDB" />
<jsp:useBean scope="page" id="ExecuteWay" class="dfbz.ExecuteWay" />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>电费报账明细查询</title>
<style>
body{background:#E8FBFF;}
</style><%
String str1="select * from dzb";
    ResultSet rs2=ExecuteWay.exeSqlQuery(str1);
    int  count=0;

%>
<script language= "javascript ">
        var scount1=0;
        var stype=new Array();
        <%
        while(rs2.next()){
        %>
        stype[<%=count%>]=new Array("<%=rs2.getString("yddd")%>","<%=rs2.getString("fid")%>",<%=rs2.getInt("id")%>);
        <%
        count++;
        }
        %>
        scount1=<%=count%>;
        function changetext(fid)
        {
              document.test.yddd.length=0;
              var fid=fid;
              var i;
              document.test.yddd.options[0]=new Option('---请选择分公司---','');
              for(i=0;i<scount1;i++)
              {
                      if(stype[i][1]==fid)
                      {
                      document.test.yddd.options[document.test.yddd.length]=new Option(stype[i][0],stype[i][2]);
                      }
                      }
                }
</script> <script language="javascript">
function Check(yf){
  var yf = document.test.yf.value;
  var test = document.getElementById("test");
  if(yf == 0)
  {
    test.action = "bhnresult2.jsp";
  }
  else
    {
    test.action = "bhnresult1.jsp";
}
}
</script>
</head>
<body>

     <form  method="post" name="test" id="test" target=_self>
<table width="300"  height="178" cellspacing="2" cellpadding="1" align="center" border="0" id="mysjs">
     <TR>

     <td width="20%" align="right">分公司:</td>
     <td width="20%" align=right>
        <select style="WIDTH: 150px" id=fgs name="fgs" onchange="changetext(document.test.fgs.options[document.test.fgs.selectedIndex].value)">
        <option value="" selected>
        <% String str="select * from fgs";

ResultSet rs = ExecuteWay.exeSqlQuery(str);//connbean是一个javabean,如果不会请不要问我，请去看看书。
while(rs.next()){
out.println("<option value='"+rs.getInt("id")+"'>"+ rs.getString("name")+"</option>");
   }
   rs.close();
%>
       
        </select>        </td>
     <tr>
        <td width="20%" align=right>用电地点: </td>
        <td width="20%" align=right>
        
        <select name="yddd" id="yddd" style="WIDTH: 150px">
        <option value=""></option>
        </select>
        </td>
     </tr>



     <tr>
     <td width="20%" align=right>用电类型: </td>
     <td width="20%" align=right>
      <select style="WIDTH: 150px" id=ydlx name="ydlx" >
      <option value="" selected>
      <option value="普工">普工
        <option value="生产">生产
        <option value="商业">商业
        <option value="营业">营业
        <option value="变损">变损
        <option value="工业">工业用电
        <option value="生活">生活用电
      </select>     </td>
    </TR>
    <tr>
        <td width="20%" align=right>月    份: </td>
     <td width="20%" align=right>
        <select style="WIDTH: 150px" id=yf name="yf" >
        <option value="0" selected>
        <option value="1">1
        <option value="2">2
        <option value="3">3
        <option value="4">4
        <option value="5">5
        <option value="6">6
        <option value="7">7
        <option value="8">8
        <option value="9">9
        <option value="10">10
        <option value="11">11
        <option value="12">12
        </select>     </td>
     </tr>
<TR>
     <td colSpan=2 align="center">
              
<input type="submit" value="查询" name=submit onClick="return Check(yf)">
    　　
    <input type=reset value="重填" name=reset></td>
    </TR>
    </table>

    </form>



  </body>
</html>

页面代码如上运行的时候分公司那个下拉框可以从数据库取出数据了但是选择分公司的时候用电地点没有跟着出来，提示脚本错误错误提示如下
Line：2720
Char：1
Code：0
Error：缺少对象根本就没有2720这一行啊。大家帮我看看上面的JS哪里有错啊？

对ajax还不熟悉
这个东西领导已经追杀着要了，急啊

不想写的那么麻烦
给你个思路吧
第一个下拉菜单你加上 onchang="didian();"function createXMLHttpRequest() {
    if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
}
function didian() {
  var gongsi = document.getElementById(第一个select的id).value;
  createXMLHttpRequest();
  xmlHttp.open("GET", "后台servlet?gongsi=" + gongsi, false);
  xmlHttp.send();
  var e = xmlHttp.responseXML.getElementsByTagName("didian");
  var c = e[0].childNodes[0].firstChild.nodeValue;
  alert(c);//测试是不是你想要的值
  document.getElementById(第一个select的id).value = c;//这句代码可能有问题
}后台代码：StringBuffer results = new StringBuffer("<dd>");
response.setContentType("text/html;charset=UTF-8");
String gongsi = request.getParameter("gongsi");
//连接数据库获取地点 didian
results.append("<didian><di>" + didian + "</di></didian>");
results.append("</dd>");

response.setContentType("text/xml");
response.getWriter().write(results.toString());

忘说了，邮件名称是“testAjax.rar”

我们那用的也是ajax的DWR.
给楼主的建议: 取数据写入两个select 你应该会把？
然后第一个select name为分公司名称 value为分公司地点.
然后调用onchang 比较第二个select name或value值为刚才所选value.设成选中就可以了.
调用数据库一次就应该可以了.

22楼这样不能满足我的要求
因为第一个select的value还必须是分公司名称，我还要用这个value值来查询。我没用过ajax，不懂得写啊

调试易

紧急：100分求JSP+sql二级联动菜单！

解决方案 »