在csdn上见到一个朋友问的，私信又有字数限制，所以在这里写一篇博客：
首先，了解一下二级菜单的作用。即：二级菜单会根据一级菜单值的不同而动态的改变其下拉选项的值。
下面是根据所属园区改变楼宇的值：
首先：新建两个选择菜单，作为一级菜单和二级菜单。
所属园区
<select id="parkID" name="parkID" style="width:180px;height:30px" onchange="javascript:setBuilding()">
<option value=""> 请选择</option>
</select>
所属楼宇
<select id="buildingID" name="buildingID" style="width:180px;height:30px"></select>
然后：在页面加载时为一级菜单赋值：
$(document).ready(function(){
/* 为园区信息下拉框赋值 */
$.ajax({
url:"getPark",
type:"POST",
dataType: "json",
success:function(data){
for(var i=0;i<data.length;i++){
var option = $("<option>").text(data[i].parkName).val(data[i].id);
$("#parkID").append(option);
}
}
});
})
而后：在一级菜单值被改变时，为二级菜单赋值
function setBuilding(){
var parkID=$("#parkID").val();/*获取到一级菜单的下拉值*/
if(parkID!=""&&parkID!=null){/*判断其是否选择了有效的值*/
$("#buildingID").empty(); /*将楼宇信息下拉框的内容清空，否则会出现下拉框的值一直累加*/
$.ajax({
url:"getBuilding",
type:"POST",
data:{
"parkID":parkID,
},
dataType: "json",
success:function(data){
for(var i=0;i<data.length;i++){
var option = $("<option>").text(data[i].buildingName).val(data[i].id);
$("#buildingID").append(option);
}
}
});
}else{/*如果用户选择了无效的值*/
$("#buildingID").empty(); /*将二级菜单的下拉框的内容清空*/
}
}
新手一个，二级菜单的方法应该有很多，希望共同进步。
