js는 지방 및 도시 3단계 연결 선택 상자 코드 Sharing_javascript 기술을 구현합니다.

작전 효과:

===================================== == ============
코드 부분:
========================== ====== ===================
물론 먼저 데이터베이스에 이 테이블이 있어야 합니다. 그렇지 않으면 데이터가 없습니다...^ _^

코드 복사 코드는 다음과 같습니다.

위치:



input type="hidden" id="myRegion" value="${user.regionId}"/>
:forEach items="${xzqhs}" var ="xzqh">
${xzqh.province }










js 코드:

코드 복사

코드는 다음과 같습니다. /*** 로드 도시

*

*/
function loadCity() {
var ProvinceId = $("#provinceSelect option:selected").val() ;
if(provinceId == null || ProvinceId == ""){
//alert("주를 찾을 수 없음"); }else{
$.post(rootPath "/ loadCity", {
"q" : ProvinceId
}, function(data, result) {
if(data == "noId"){
alert("요청 오류");
}else if(data == "null"){
alert("시스템이 해당 지역에 속한 도시를 찾을 수 없습니다.")
}else {
data = eval("{" data "} ");
var citySelect = $("#citySelect")
var myCity = $("#myCity").val(); 🎜>citySelect.html("");
for ( var i = 0; i < data.length; i ) {
if(myCity != null && myCity != "" && myCity > 0 && myCity == data[i].id){
citySelect.append(""
data[i] .name "");
}else{
citySelect.append(""
data[i] .name "");
}
}
loadRegion()
}
}); *
* 로딩 영역
*
*/
function loadRegion() {
var cityId = $("#citySelect option:selected").val()
if(cityId == null || cityId == " " || cityId < 1){
alert( "도시를 찾을 수 없음");
}else{
$.post(rootPath "/loadRegion", {
"q" : cityId
}, function(data, result) {
if(data == "noId"){
alert("요청 오류")
}else if(data == "null"){
alert("시스템이 이 도시 지역에 속한 파일을 찾을 수 없습니다.");
}else{
data = eval("{" data "}")
var RegionSelect = $( "#regionSelect");
var myRegion = $(" #myRegion").val();
regionSelect.html("")
for ( var i = 0; i < data. length; i ) {
if(myRegion != null && myRegion != "" && myRegion > 0 && myRegion == data[i].id){
regionSelect.append(""
data[i].name "");
}else{
regionSelect.append(" "
data[i].name "");
}
}
}
});
}
};
/**
* 지방 변경 이벤트
*
*/
$("#provinceSelect").change(loadCity)
/**
* 도시 변경 이벤트
*
* /
$("#citySelect").change(loadRegion )

$(function() {
loadCity();
})


백그라운드 방식:




코드 복사

코드는 다음과 같습니다.

/**
* 도시 데이터 로드
*
*/
public void loadCity() {
if (q == null || q.trim().equals("")) {
write("noId");
} else {
목록 citys = xzqhService.queryCitys(q.trim());
if (citys == null || citys.size() < 1) {
write("null");
} else {
StringBuilder 빌더 = new StringBuilder("[");
for (Xzqh city : citys) {
builder.append("{'id':'");
builder.append(city.getCityId());
builder.append("','name':'");
builder.append(city.getCity());
builder.append("'},");
}
if (builder.length() > 1)
builder.replace(builder.length() - 1, builder.length(), "]");
write(builder.toString());
}
}
}
/**
* 영역 데이터 로드
*
*/
public void loadRegion() {
if (q == null || q.trim().equals ("")) {
write("noId");
} else {
목록 citys = xzqhService.queryDistricts(q.trim());
if (citys == null || citys.size() < 1) {
write("null");
} else {
StringBuilder 빌더 = new StringBuilder("[");
for (Xzqh 지역 : 도시) {
builder.append("{'id':'");
builder.append(district.getRegionId());
builder.append("','name':'");
builder.append(district.getRegion());
builder.append("'},");
}
if (builder.length() > 1)
builder.replace(builder.length() - 1, builder.length(), "]");
write(builder.toString());
}
}
}