JQuery级联下拉菜单实现代码

function show_hnbInfo() 
{ 
    var ss = Math.random(); 
    $.ajax( 
    { 
        type : 'POST', 
        url : 'getAllHnbInfo', 
        data : 'id=' + ss, 
        success : function(msg) 
        { 
            // 清空表格 
            $("#internetID").empty(); 
             
            // 转换成json对象 
            var data = JSON.parse(msg); 
             
            var option = "<option value=\"\">请选择...</option>"; 
             
            // 循环组装下拉框选项 
            $.each(data, function(k, v) 
            { 
                option += "<option value=\"" + v['internetID'] + "\">" + v['hnbName'] + "</option>"; 
            }); 
            $("#internetID").append(option); 
            $("#internetID").change(function() 
            { 
                show_freqHnbInfo($(this).val()); 
            }); 
        }, 
        error : function(msg, textStatus, e) 
        { 
            alert("当前登录用户失效，请重新登录。"); 
            window.location = path + "/login.jsp"; 
        } 
    }); 
} 

function show_freqHnbInfo(internetId) 
{ 
    var ss = Math.random(); 
    $.ajax( 
    { 
        type : 'POST', 
        url : 'getAllHnbOnlineOutByOne', 
        data : 'id=' + ss + '&internetId=' + internetId, 
        success : function(msg) 
        { 
            // 清空表格 
            $("#internetId").empty(); 
             
            // 转换成json对象 
            var data = JSON.parse(msg); 
             
            var option = ""; 
             
            // 循环组装下拉框选项 
            $.each(data, function(k, v) 
            { 
                option += "<option value=\"" + v['internetID'] + "\">" + v['hnbName'] + "</option>"; 
            }); 
             
            if (internetId == "" || internetId == null || internetId == undefined) 
            { 
                option += "<option value=\"\">请选择...</option>"; 
            } 
             
            $("#internetId").append(option); 
             
        }, 
        error : function(msg, textStatus, e) 
        { 
            alert("当前登录用户失效，请重新登录。"); 
            window.location = path + "/login.jsp"; 
        } 
    }); 
} 
 

<script type="text/javascript" src="${pageContext.request.contextPath}/script/config/freqCell.js"></script> 
<script type="text/javascript"> 
    var type = "${type }"; 
    var path = "${pageContext.request.contextPath}"; 
    show_hnbInfo(); 
    show_freqHnbInfos(); 
</script> 
 
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" class="borderquan"> 
  <tr> 
    <td width="25%" height="30" align="center" class="borderbottomright">基站名称</td> 
    <td width="75%" class="borderbottom"><label> 
        <select name="internetID" id="internetID" style="width:318px"> 
            <option value="">请选择...</option> 
        </select> 
      <FONT SIZE="" COLOR="red">*</FONT> 
      <input type="hidden" name="type" id="type" value="${type }"> 
      <span id="staError" style="font-size: 9pt; font-family: 黑体; color: red"></span> 
    </label></td> 
  </tr> 
  <tr> 
    <td width="25%" height="30" align="center" class="borderbottomright"><c:if test="${type=='intra' }">同频</c:if><c:if test="${type=='inter' }">异频</c:if>邻基站名称</td> 
    <td width="75%" class="borderbottom"><label> 
      <select name="internetId" id="internetId" style="width:318px"> 
            <option value="">请选择...</option> 
        </select> 
      <FONT SIZE="" COLOR="red">*</FONT> 
      <span id="staErrors" style="font-size: 9pt; font-family: 黑体; color: red"></span> 
    </label></td> 
  </tr> 
  <tr> 
    <td height="30" colspan="2" align="center"> 
      <input type="button" name="save" class="myBtn" value="保　存" onclick="submitForm();" /> 
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
      <input type="button" name="backtrack" class="myBtn" value="返　回" onclick="goback();"/> 
    </td> 
  </tr> 
</table> 

@RequestMapping("/getAllHnbInfo") 
    public void getAllHnbByJosn(HttpServletRequest request, HttpServletResponse response) 
    { 
        PrintWriter out = null; 
        try 
        { 
            // 设置输出格式 
            response.setContentType("text/html"); 
             
            // 页面输出对象 
            out = response.getWriter(); 
            out.write(hnbService.getAllHnbByJosn()); 
            out.flush(); 
            out.close(); 
             
        } 
        catch (Exception e) 
        { 
            logger.error(Global.LOG_EXCEPTION_NAME, e); 
            if (null != out) 
            { 
                out.write("[]"); 
                out.flush(); 
                out.close(); 
            } 
        } 
    } 
     
    /**
     * <获取所有基站名称和基站标识返回josn串>
     * <功能详细描述>
     * @param request
     * @return
     * @see [类、类#方法、类#成员]
     */ 
    @RequestMapping("/getAllHnbOnlineOutByOne") 
    public void getAllHnbOnlineOutByOne(HttpServletRequest request, HttpServletResponse response) 
    { 
        PrintWriter out = null; 
        try 
        { 
            String internetId = request.getParameter("internetId"); 
             
            // 设置输出格式 
            response.setContentType("text/html"); 
             
            // 页面输出对象 
            out = response.getWriter(); 
            out.write(hnbService.getAllHnbOnlineOutByOne(internetId)); 
            out.flush(); 
            out.close(); 
             
        } 
        catch (Exception e) 
        { 
            logger.error(Global.LOG_EXCEPTION_NAME, e); 
            if (null != out) 
            { 
                out.write("[]"); 
                out.flush(); 
                out.close(); 
            } 
        } 
    } 
} 
 

@Override 
    public String getAllHnbByJosn() 
    { 
        List<HnbInfo> hnbList = getHnbOnlineList(); 
        if (null != hnbList) 
        { 
            StringBuffer sb = new StringBuffer(); 
            sb.append("["); 
             
            //得到集合的长度 
            int size = hnbList.size(); 
            int i = 0; 
             
            for (HnbInfo hnbInfo : hnbList) 
            { 
                i++; 
                 
                String internetID = hnbInfo.getInternetID(); 
                String hnbIdentifier = hnbInfo.getHnbIdentifier(); 
                String hnbName = hnbInfo.getHnbName(); 
                 
                sb.append("{\"internetID\":\""); 
                sb.append(internetID); 
                sb.append("\",\"hnbIdentifier\":\""); 
                sb.append(hnbIdentifier); 
                sb.append("\",\"hnbName\":\""); 
                sb.append(hnbName); 
                sb.append("\"}"); 
                 
                //如果i小于size字符串sb中加"," 
                if (i < size) 
                { 
                    sb.append(","); 
                } 
            } 
             
            sb.append("]"); 
             
            //拼好的字符串赋值给变量 
            return sb.toString(); 
        } 
        else 
        { 
            return "[]"; 
        } 
    }
 
 @Override 
    public String getAllHnbOnlineOutByOne(String internetId) 
    { 
        // 根据基站ID 获取基站信息 
        InternetGatewayDevice internet = hnbDao.getOneHnbByInternetID(internetId); 
        if (null != internet && !Global.isEmpty(internet.getApIpAdress())) 
        { 
            // 根据基站注册IP地址获取所有除基站注册IP地址对应的基站外的所有基站 
            List<HnbInfo> hnblist = getAllHnbOutByone(internet.getApIpAdress()); 
            if (null != hnblist && hnblist.size() != 0) 
            { 
                StringBuffer sb = new StringBuffer(); 
                sb.append("["); 
                 
                //得到集合的长度 
                int size = hnblist.size(); 
                int i = 0; 
                 
                for (HnbInfo hnbInfo : hnblist) 
                { 
                    i++; 
                     
                    String internetID = hnbInfo.getInternetID(); 
                    String hnbIdentifier = hnbInfo.getHnbIdentifier(); 
                    String hnbName = hnbInfo.getHnbName(); 
                     
                    sb.append("{\"internetID\":\""); 
                    sb.append(internetID); 
                    sb.append("\",\"hnbIdentifier\":\""); 
                    sb.append(hnbIdentifier); 
                    sb.append("\",\"hnbName\":\""); 
                    sb.append(hnbName); 
                    sb.append("\"}"); 
                     
                    //如果i小于size字符串sb中加"," 
                    if (i < size) 
                    { 
                        sb.append(","); 
                    } 
                } 
                 
                sb.append("]"); 
                 
                //拼好的字符串赋值给变量 
                return sb.toString(); 
            } 
            else 
            { 
                return "[]"; 
            } 
        } 
        else 
        { 
            return "[]"; 
        } 
    }