Javascirpt 성, 시 지역 select 목록, JSon 저장 실현

최근 에 코드 를 재 구성 할 때 성 시 급 련 의 처리 에 있어 ajax 요청 으로 이 루어 졌 습 니 다. 데이터 베 이 스 를 자주 조작 하 는 것 에 대해 아마 존의 페이지 에 이런 성 시내 형식의 JSon 데이터 가 있 는 것 을 보고 자신 도 한번 해 보고 싶 었 습 니 다.백 스테이지 시내 의 업 데 이 트 를 감청 하고 제 이 슨 형식 데 이 터 를 다시 생 성 할 지 여 부 는 아직 시험 하지 않 았 다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
 </head>

 <body>
  <select id="provinces">
	<option value="">   </option>
  </select>
  <select id="cites">
	<option value="">   </option>
  </select>
 </body>
 <script type="text/javascript">
  
  var oProvinceSelect=document.getElementById("provinces");
  var oCitySelect=document.getElementById("cites");
  var oOption;//	option  
  var oCities;//	      
  var nCitiesLength;//       
  var area=[{"num":"11","name":"  ","children":[{"num":"02","name":"  "},{"num":"03","name":"  "},{"num":"05","name":"  "},{"num":"08","name":"  "},{"num":"12","name":"  "},{"num":"13","name":"  "},{"num":"14","name":"  "},{"num":"15","name":"  "},{"num":"17","name":"  "},{"num":"18","name":"  "},{"num":"20","name":"  "},{"num":"28","name":"  "},{"num":"29","name":"   "}]},{"num":"4A","name":"  ","children":[{"num":"03","name":"  "}]}];


	/*	province_select   	*/

	for(var i=0;i<area.length;i++){
		oOption=document.createElement('option');
		oOption.text=area[i].name;
		oOption.value=area[i].num;
		oProvinceSelect.add(oOption,null);
	}

	oProvinceSelect.onchange=function(){
		nCitiesLength=oCitySelect.length;
		for(var z=1;z<nCitiesLength;z++){
			oCitySelect.remove(1);
		}
		for(var j=0;j<area.length;j++){
			if(area[j].num==oProvinceSelect.value){
				oCities=area[j].children;	
					for(var k=0;k<oCities.length;k++){
						oOption=document.createElement('option');
						oOption.text=oCities[k].name;
						oOption.value=oCities[k].num;
						oCitySelect.add(oOption,null);
					}
			}
		}
	 }
 </script>
</html>

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

[JS/브라우저] DOM

1.<head>안쪽에 <script>추가하기 2.<body> 내의 최하단에 <script>추가하기 HTML 태그들 사이에 script 태그가 위치하면 발생하는 2가지 문제 위와 같은 상황을 막기 위해 script 태...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

Javascirpt 성, 시 지역 select 목록, JSon 저장 실현

좋은 웹페이지 즐겨찾기