JavaScript.js地区二級連動、省市二級連動、省市県js+xml三級連動


より良い二級連動:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<script language="javascript" type="text/javascript">
provinceArray = new Array("   ","   ","   ","   ","   ","   ","      ","   ","   ","    ","   ","   ","   ","   ","   ","   ","   ","   ","   ","   ","       ","   ","   ","   ","   ","     ","   ","   ","       ","   ","         ","       ","       ","   ","  ");

//          
cityArray = new Array(); 
cityArray[0] = new Array("   ","  |  |  |  |  |  |   |  |   |  |  |  |  |  |  |  |  |  "); 
cityArray[1] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[2] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[3] = new Array("   ","  |  |  |   |  |   |   |  |  |  |  |  |  |  |  |  |  |   |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[4] = new Array("   ","   |  |  |  |   |  |  |  |   |  |  "); 
cityArray[5] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[6] = new Array("      ","    |  |  |  |     |    |    |   |     |     |     |    "); 
cityArray[7] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |   "); 
cityArray[8] = new Array("   ","  |  |  |  |  |  |  |  |  "); 
cityArray[9] = new Array("    ","   |    |   |   |  |  |  |  |  |   |  |   |    "); 
cityArray[10] = new Array("   ","  |  |  |  |  |  |  |   |  |  |  |  |  "); 
cityArray[11] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[12] = new Array("   ","  |  |  |   |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[13] = new Array("   ","  |  |  |  |  |  |  |  |  "); 
cityArray[14] = new Array("   ","   |   |  |  |  |  |  |  |  |  |  "); 
cityArray[15] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[16] = new Array("   ","  |  |  |   |  |  |  |  |  |  |  |   |  |  |  |  |   |  "); 
cityArray[17] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  ");
cityArray[18] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |   "); 
cityArray[19] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[20] = new Array("       ","  |  |  |  |  |   |  |  |  |    |    |  |  |  "); 
cityArray[21] = new Array("   ","  |  "); 
cityArray[22] = new Array("   ","  |  |  |  |   |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[23] = new Array("   ","  |   |  |  |  |   |  |   |  "); 
cityArray[24] = new Array("   ","  |  |  |  |  |  |  |  |  |    |  |  |  |  |  |  ");
cityArray[25] = new Array("     ","  |   |  |  |  |  |  "); 
cityArray[26] = new Array("   ","  |  |  |  |  |  |  |  |  |  "); 
cityArray[27] = new Array("   ","  |   |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[28] = new Array("       ","  |   |  |  "); 
cityArray[29] = new Array("   ","  |  |  |  |  |  |  |  "); 
cityArray[30] = new Array("         ","    |   |    |  |    |  |        |    |   |  |  |  |   "); 
cityArray[31] = new Array("       ","       "); 
cityArray[32] = new Array("       ","       "); 
cityArray[33] = new Array("   ","  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
cityArray[34] = new Array("  ","   |   |  |  |  |   ");

function initProvince(){
document.all.selProvince.length = 0 ; 
for(i=0; i<provinceArray.length; i++){
   document.all.selProvince.options[i] = new Option(provinceArray[i],provinceArray[i]);
}
getCity(document.all.selProvince.options[0].value)
}

function getCity(currProvince)
{
    //          
    var currProvince = currProvince;
    var i,j,k;
    //          
    document.all.selCity.length = 0 ; 
    for (i = 0 ;i <cityArray.length;i++)
      {   
          //                 
          if(cityArray[i][0]==currProvince)
            {   
                //              
                tmpcityArray = cityArray[i][1].split("|")
                  for(j=0;j<tmpcityArray.length;j++)
                  {
                    //          
                    document.all.selCity.options[document.all.selCity.length] = new Option(tmpcityArray[j],tmpcityArray[j]); 
                  }
            } 
      } 
}
</script>

</HEAD>

<BODY onload="initProvince()">
    :
		<select name="province" id="selProvince" onChange = "getCity(this.options[this.selectedIndex].value)">
    	</select>
    	<select name="city" id="selCity">
        	<option>  </option>
    	</select>
</BODY>
</HTML>
二段階連動:
<html>
<head> 
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body bgcolor=#FFFFFF alink=#333333 vlink=#333333 link=#333333 topmargin=0 leftmargin=0>
<form action="http://www.chinaleader.com/cgi-bin/register.cgi" method=post name="creator" enctype="multipart/form-data">
<script language="javascript">
<!--
var where = new Array(35); 
function comefrom(loca,locacity) { this.loca = loca; this.locacity = locacity; } 
where[0]= new comefrom("      ","      ");
where[1] = new comefrom("  ","|  |  |  |  |  |  |   |  |   |  |  |  |  |  |  |  |  |  "); 
where[2] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[3] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[4] = new comefrom("  ","|  |  |  |   |  |   |   |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[5] = new comefrom("  ","|   |  |  |  |   |  |  |  |   |  |  "); 
where[6] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  "); 
where[7] = new comefrom("   ","|    |  |  |  |     |    |    |   |     |     |     |    "); 
where[8] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |   "); 
where[9] = new comefrom("  ","|  |  |  |  |  |  |  |  |  "); 
where[10] = new comefrom("   ","|   |    |   |   |  |  |  |  |  |   |  |   |    "); 
where[11] = new comefrom("  ","|  |  |  |  |  |  |  |   |  |  |  |  |  "); 
where[12] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  "); 
where[13] = new comefrom("  ","|  |  |  |   |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[14] = new comefrom("  ","|  |  |  |  |  |  |  |  |  "); 
where[15] = new comefrom("  ","|   |   |  |  |  |  |  |  |  |  |  "); 
where[16] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[17] = new comefrom("  ","|  |  |  |   |  |  |  |  |  |  |  |   |  |  |  |  |   |  "); 
where[18] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  ");
where[19] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |   "); 
where[20] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[21] = new comefrom("  ","|  |  |  |  |  |   |  |  |  |    |    |  |  |  "); 
where[22] = new comefrom("  ","|  |  "); 
where[23] = new comefrom("  ","|  |  |  |  |   |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[24] = new comefrom("  ","|  |   |  |  |  |   |  |   |  "); 
where[25] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |    |  |  |  |  |  |  ");
where[26] = new comefrom("  ","|  |   |  |  |  |  |  "); 
where[27] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  "); 
where[28] = new comefrom("  ","|  |   |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[29] = new comefrom("  ","|  |   |  |  "); 
where[30] = new comefrom("  ","|  |  |  |  |  |  |  |  "); 
where[31] = new comefrom("  ","|    |   |    |  |    |  |        |    |   |  |  |  |   "); 
where[32] = new comefrom("  ",""); 
where[33] = new comefrom("  ",""); 
where[34] = new comefrom("  ","|  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  |  "); 
where[35] = new comefrom("  ","|   |   |  |  |  |   "); 
function select() {
with(document.creator.province) { var loca2 = options[selectedIndex].value; }
for(i = 0;i < where.length;i ++) {
if (where[i].loca == loca2) {
loca3 = (where[i].locacity).split("|");
for(j = 0;j < loca3.length;j++) { with(document.creator.city) { length = loca3.length; options[j].text = loca3[j]; options[j].value = loca3[j]; var loca4=options[selectedIndex].value;}}
break;
}}
document.creator.newlocation.value=loca2+loca4;
}
function init() {
with(document.creator.province) {
length = where.length;
for(k=0;k<where.length;k++) { options[k].text = where[k].loca; options[k].value = where[k].loca; }
options[selectedIndex].text = where[0].loca; options[selectedIndex].value = where[0].loca;
}
with(document.creator.city) {
loca3 = (where[0].locacity).split("|");
length = loca3.length;
for(l=0;l<length;l++) { options[l].text = loca3[l]; options[l].value = loca3[l]; }
options[selectedIndex].text = loca3[0]; options[selectedIndex].value = loca3[0];
}}
-->
</script>
<body onload="init()">
<font color=#000000><b>  :</b><br>             。    <br><br>
   <select name="province" onChange = "select()"></select>    <select name="city" onChange = "select()"></select><br>
   <input type=text name="newlocation" maxlength=12 size=12 style="font-weight: bold">     12   (6   )
</form>
三級連動のxmlは長すぎて、くっつかなくなりました.ソースをダウンロードできます.