JQuery实现动态数据二级联动

写此博客原因：项目中需要二级联动，点击一级学科，联动到二级学科，上网查了资料，都写的是从前台获取，很不满意，决定自己写一个二级联动！
JQuery：

$(function() {
//ajax实现二级联动
$.post("${basePath}field/getjson.action",function(data){
if(data){
var field = "";
for(var i=0;i<data.length;i++){
field += "<option values='" + data[i].name + "'>" + data[i].name + "</option>";
}
$("#field").append(field);
}
//选中一级学科触发函数,异步获取二级学科
$("#field").change(function() {
var field = $("#field option:selected").val();//获取下拉列表中的选中项
$("#profession > option:gt(0)").each(function(){//避免option累加
$("#profession").empty();
});
$.post("${basePath}profession/selectAllProfession.action",{field:field},function(data,status){
var profession = "";
for(var i=0;i<data.length;i++){
profession += "<option values='" + data[i].name + "'>" + data[i].name + "</option>";
}
$("#profession").append(profession);
});
});
});
});

JSP页面：

<div class="form-group">
<label class="col-md-2 control-label"><span class="warning">*  </span>问题领域:</label>
<div class="col-md-3">
<select class="form-control" id="field">
<option>----请选择领域----</option>
</select>
</div>
<div class="col-md-3">
<select class="form-control" id="profession">
<option>----请选择专业----</option>
</select>
</div>
<div class="col-md-4">
<span class="warning" id="q2"></span>
</div>
</div>

前台JSP页面：

<div class="form-group">
<label class="col-md-2 control-label"><span class="warning">*  </span>问题领域:</label>
<div class="col-md-3">
<select class="form-control" id="field">
<option>----请选择领域----</option>
</select>
</div>
<div class="col-md-3">
<select class="form-control" id="profession">
<option>----请选择专业----</option>
</select>
</div>
<div class="col-md-4">
<span class="warning" id="q2"></span>
</div>
</div>

后台控制层：

一级学科:
@RequestMapping("/getjson")
@ResponseBody
public List<Field> getjson(){
return service.select();
}

二级学科:

@RequestMapping("/selectAllProfession")
@ResponseBody
public List<Profession> selectAllProfession(HttpServletRequest request){
String field = request.getParameter("field");
List<Profession> list = service.selectAllProfession(field);
return list;
}