DWR+Jquery省市级联动

jsp代码：
<script type='text/javascript'
src='<%=basePath%>dwr/interface/areaDwr.js'></script>
<script type='text/javascript' src='<%=basePath%>dwr/engine.js'></script>
<script type='text/javascript' src='<%=basePath%>dwr/util.js'></script>
<script type="text/javascript" src="<%=basePath%>js/jquery-1.4.2.js"></script>
<script type="text/javascript">
//省级连动
function changeArea(obj){
temSpan=$("#thirdSelect");
tempSelect=$("<select name='country' id='select7'></select>");
var fatherId=obj.value;
var secondId;
var thirdId;
dwr.engine.setAsync(false);
areaDwr.findAllChildren(fatherId,function(data){
if(data!=null){
secondId=data[0].areaid;
var secondSelect=$("#select6").html("");
for(var i=0;i<data.length;i++){
var temp=$("<option value="+data[i].areaid+">"+data[i].areaname+"</option>");
temp.appendTo(secondSelect);
}
}
}
);
areaDwr.findAllChildren(secondId,function(data){
if(data.length>0){
if(document.getElementById("select7")==null){
temSpan.append(tempSelect);
}
$("#select7").css("display","inline-block");
var secondSelect=$("#select7");
for(var i=0;i<data.length;i++){
var temp=$("<option value="+data[i].areaid+">"+data[i].areaname+"</option>");
temp.appendTo(secondSelect);
}
}else{
$("#select7").html("").css("display","none");
}
}
);
dwr.engine.setAsync(true);
}


//市级连动
function secondChange(obj){
var fatherId=obj.value;
areaDwr.findAllChildren(fatherId,function(data){
if(data.length>0){
if(document.getElementById("select7")==null){
temSpan.append(tempSelect);
}
$("#select7").css("display","inline-block");
var secondSelect=$("#select7").html("");
for(var i=0;i<data.length;i++){
var temp=$("<option value="+data[i].areaid+">"+data[i].areaname+"</option>");
temp.appendTo(secondSelect);
}
}else{
$("#select7").html("").css("display","none");
}
}
);
}
</script>

选择框:
<td colspan="2" align="left" bgcolor="eff3f6">

<select name="province" id="select5"
οnchange="changeArea(this)">
<c:forEach items="${fatherAreas }" var="fatherArea">
<c:choose>
<c:when test="${fatherArea.areaid==member.extcredits1}">
<option value="${fatherArea.areaid }" selected="selected">
${fatherArea.areaname }
</option>
</c:when>
<c:otherwise>
<option value="${fatherArea.areaid }">
${fatherArea.areaname }
</option>
</c:otherwise>
</c:choose>
</c:forEach>
</select>

<select name="city" id="select6" οnchange="secondChange(this)">
<c:forEach items="${firstAreas }" var="firstArea">
<c:choose>
<c:when test="${firstArea.areaid==member.extcredits2}">
<option value="${firstArea.areaid }" selected="selected">
${firstArea.areaname }
</option>
</c:when>
</c:choose>
<option value="${firstArea.areaid }">
${firstArea.areaname }
</option>
</c:forEach>
</select>
<span id="thirdSelect">

</span>


<c:if test="${secondAreas!=null}">
<select name="country" id="select7">
<c:forEach items="${secondAreas}" var="secondArea">
<c:choose>
<c:when test="${secondArea.areaid==member.extcredits3}">
<option value="${secondArea.areaid }"
selected="selected">
${secondArea.areaname }
</option>
</c:when>
<c:otherwise>
<option value="${secondArea.areaid }">
${secondArea.areaname }
</option>
</c:otherwise>
</c:choose>
</c:forEach>
</select>
</c:if>

java后台代码:
/**
* 查询父节点下面的所有的子节点
*/
public List<Area> findAllChildren(Integer fatherId) {
List<Area> areas=areaService.findAllChildren(fatherId);
return areas;
}


表结构是树形结构:北京市 下朝阳区
河北省 下 石家庄市 等.
one to many 结构.