JS+XML 省份和城市之间的联动实现代码

xml：
Provinces.xml


代码如下:

<?xml version="1.0"?>
<Root>
<Province ID="1" Name="安徽">
<City ID="1">安庆市</City>
<City ID="2">蚌埠市</City>
<City ID="3">亳州市</City>
<City ID="4">巢湖市</City>
<City ID="5">池州市</City>
<City ID="6">滁州市</City>
<City ID="7">阜阳市</City>
<City ID="8">合肥市</City>
<City ID="9">淮北市</City>
<City ID="10">淮南市</City>
<City ID="11">黄山市</City>
<City ID="12">六安市</City>
<City ID="13">马鞍山市</City>
<City ID="14">宿州市</City>
<City ID="15">铜陵市</City>
<City ID="16">芜湖市</City>
<City ID="17">宣城市</City>
</Province>
<Province ID="2" Name="北京">
<City ID="18">昌平区</City>
<City ID="19">朝阳区</City>
<City ID="20">崇文区</City>
<City ID="21">大兴区</City>
<City ID="22">东城区</City>
<City ID="23">房山区</City>
<City ID="24">丰台区</City>
<City ID="25">海淀区</City>
<City ID="26">怀柔区</City>
<City ID="27">门头沟区</City>
<City ID="28">密云县</City>
<City ID="29">平谷区</City>
<City ID="30">石景山区</City>
<City ID="31">顺义区</City>
<City ID="32">通州区</City>
<City ID="33">西城区</City>
<City ID="34">宣武区</City>
<City ID="35">延庆县</City>
</Province>
<Province ID="3" Name="重庆">
<City ID="36">巴南区</City>
<City ID="37">北碚区</City>
<City ID="38">长寿区</City>
<City ID="39">达州市</City>
<City ID="40">涪陵区</City>
<City ID="41">江北区</City>
<City ID="42">九龙坡区</City>
<City ID="43">南岸区</City>
<City ID="44">黔江区</City>
<City ID="45">沙坪坝区</City>
<City ID="46">双桥区</City>
<City ID="47">万盛区</City>
<City ID="48">万州区</City>
<City ID="49">渝北区</City>
<City ID="50">渝中区</City>
<City ID="51">璧山县</City>
<City ID="52">城口县</City>
<City ID="53">大足县</City>
<City ID="54">垫江县</City>
<City ID="55">丰都县</City>
<City ID="56">奉节县</City>
<City ID="57">合川市</City>
<City ID="58">江津市</City>
<City ID="59">开县</City>
<City ID="60">梁平县</City>
<City ID="61">南川市</City>
<City ID="62">彭水苗族土家族自治县</City>
<City ID="63">綦江县</City>
<City ID="64">荣昌县</City>
<City ID="65">石柱土家族自治县</City>
<City ID="66">铜梁县</City>
<City ID="67">潼南县</City>
<City ID="68">巫山县</City>
<City ID="69">巫溪县</City>
<City ID="70">武隆县</City>
<City ID="71">秀山土家族苗族自治县</City>
<City ID="72">永川市</City>
<City ID="73">酉阳土家族苗族自治县</City>
<City ID="74">云阳县</City>
<City ID="75">忠县</City>
</Province>
<Province ID="4" Name="福建">
<City ID="76">城厢区</City>
<City ID="77">福州市</City>
<City ID="78">涵江区</City>
<City ID="79">荔城区</City>
<City ID="80">龙岩市</City>
<City ID="81">南平市</City>
<City ID="82">宁德市</City>
<City ID="83">莆田市</City>
<City ID="84">泉州市</City>
<City ID="85">三明市</City>
<City ID="86">厦门市</City>
<City ID="87">秀屿区</City>
<City ID="88">秀屿区</City>
<City ID="89">漳州市</City>
</Province>
<Province ID="5" Name="甘肃">
<City ID="90">白银市</City>
<City ID="91">定西市</City>
<City ID="92">甘南州</City>
<City ID="93">海南州</City>
<City ID="94">金昌市</City>
<City ID="95">酒泉市</City>
<City ID="96">兰州市</City>
<City ID="97">临夏州</City>
<City ID="98">陇南市</City>
<City ID="99">平凉市</City>
<City ID="100">庆阳市</City>
<City ID="101">天水市</City>
<City ID="102">武威市</City>
<City ID="103">张掖市</City>
</Province>
<Province ID="6" Name="广东">
<City ID="104">潮州市</City>
<City ID="105">东莞市</City>
<City ID="106">佛山市</City>
<City ID="107">广州市</City>
<City ID="108">河源市</City>
<City ID="109">惠州市</City>
<City ID="110">江门市</City>
<City ID="111">揭阳市</City>
<City ID="112">茂名市</City>
<City ID="113">梅州市</City>
<City ID="114">清远市</City>
<City ID="115">汕头市</City>
<City ID="116">汕尾市</City>
<City ID="117">韶关市</City>
<City ID="118">深圳市</City>
<City ID="119">阳江市</City>
<City ID="120">云浮市</City>
<City ID="121">湛江市</City>
<City ID="122">肇庆市</City>
<City ID="123">中山市</City>
<City ID="124">珠海市</City>
</Province>
<Province ID="7" Name="广西">
<City ID="125">百色市</City>
<City ID="126">北海市</City>
<City ID="127">崇左市</City>
<City ID="128">防城港市</City>
<City ID="129">贵港市</City>
<City ID="130">桂林市</City>
<City ID="131">河池市</City>
<City ID="132">贺州市</City>
<City ID="133">来宾市</City>
<City ID="134">柳州市</City>
<City ID="135">南宁市</City>
<City ID="136">钦州市</City>
<City ID="137">梧州市</City>
<City ID="138">玉林市</City>
</Province>
<Province ID="8" Name="贵州">
<City ID="139">安顺市</City>
<City ID="140">毕节地区</City>
<City ID="141">贵阳市</City>
<City ID="142">六盘水市</City>
<City ID="143">黔东南苗族侗族自治州</City>
<City ID="144">黔南布依族苗族自治州</City>
<City ID="145">黔西南布依族苗族自治州</City>
<City ID="146">铜仁地区</City>
<City ID="147">遵义市</City>
</Province>
<Province ID="9" Name="海南">
<City ID="148">海口市</City>
<City ID="149">海南沿革</City>
<City ID="150">三亚市</City>
<City ID="151">大渡口区</City>
</Province>
<Province ID="10" Name="河北">
<City ID="152">保定市</City>
<City ID="153">沧州市</City>
<City ID="154">承德市</City>
<City ID="155">邯郸市</City>
<City ID="156">衡水市</City>
<City ID="157">廊坊市</City>
<City ID="158">秦皇岛市</City>
<City ID="159">石家庄市</City>
<City ID="160">唐山市</City>
<City ID="161">邢台市</City>
<City ID="162">张家口市</City>
</Province>
<Province ID="11" Name="河南">
<City ID="163">安阳市</City>
<City ID="164">鹤壁市</City>
<City ID="165">焦作市</City>
<City ID="166">开封市</City>
<City ID="167">洛阳市</City>
<City ID="168">漯河市</City>
<City ID="169">南阳市</City>
<City ID="170">平顶山市</City>
<City ID="171">濮阳市</City>
<City ID="172">三门峡市</City>
<City ID="173">商丘市</City>
<City ID="174">新乡市</City>
<City ID="175">信阳市</City>
<City ID="176">许昌市</City>
<City ID="177">郑州市</City>
<City ID="178">周口市</City>
<City ID="179">驻马店市</City>
</Province>
<Province ID="12" Name="黑龙江">
<City ID="180">大庆市</City>
<City ID="181">大兴安岭地区</City>
<City ID="182">哈尔滨市</City>
<City ID="183">鹤岗市</City>
<City ID="184">黑河市</City>
<City ID="185">鸡西市</City>
<City ID="186">佳木斯市</City>
<City ID="187">牡丹江市</City>
<City ID="188">七台河市</City>
<City ID="189">齐齐哈尔市</City>
<City ID="190">双鸭山市</City>
<City ID="191">绥化市</City>
<City ID="192">伊春市</City>
</Province>
<Province ID="13" Name="湖北">
<City ID="193">鄂州市</City>
<City ID="194">恩施土家族苗族自治州</City>
<City ID="195">黄冈市</City>
<City ID="196">黄石市</City>
<City ID="197">荆门市</City>
<City ID="198">荆州市</City>
<City ID="199">十堰市</City>
<City ID="200">随州市</City>
<City ID="201">武汉市</City>
<City ID="202">咸宁市</City>
<City ID="203">襄樊市</City>
<City ID="204">孝感市</City>
<City ID="205">宜昌市</City>
</Province>
<Province ID="14" Name="湖南">
<City ID="206">长沙市</City>
<City ID="207">常德市</City>
<City ID="208">郴州市</City>
<City ID="209">衡阳市</City>
<City ID="210">怀化市</City>
<City ID="211">娄底市</City>
<City ID="212">邵阳市</City>
<City ID="213">湘潭市</City>
<City ID="214">湘西土家族苗族自治州</City>
<City ID="215">益阳市</City>
<City ID="216">永州市</City>
<City ID="217">岳阳市</City>
<City ID="218">张家界市</City>
<City ID="219">株洲市</City>
</Province>
<Province ID="15" Name="吉林">
<City ID="220">白城市</City>
<City ID="221">白山市</City>
<City ID="222">长春市</City>
<City ID="223">吉林市</City>
<City ID="224">辽源市</City>
<City ID="225">四平市</City>
<City ID="226">松原市</City>
<City ID="227">通化市</City>
<City ID="228">延边朝鲜族自治州</City>
</Province>
<Province ID="16" Name="江苏">
<City ID="229">常州市</City>
<City ID="230">淮安市</City>
<City ID="231">连云港市</City>
<City ID="232">南京市</City>
<City ID="233">南通市</City>
<City ID="234">苏州市</City>
<City ID="235">宿迁市</City>
<City ID="236">泰州市</City>
<City ID="237">无锡市</City>
<City ID="238">徐州市</City>
<City ID="239">盐城市</City>
<City ID="240">扬州市</City>
<City ID="241">镇江市</City>
</Province>
<Province ID="17" Name="江西">
<City ID="242">抚州市</City>
<City ID="243">赣州市</City>
<City ID="244">吉安市</City>
<City ID="245">景德镇市</City>
<City ID="246">九江市</City>
<City ID="247">南昌市</City>
<City ID="248">萍乡市</City>
<City ID="249">上饶市</City>
<City ID="250">新余市</City>
<City ID="251">宜春市</City>
<City ID="252">鹰潭市</City>
</Province>
<Province ID="18" Name="辽宁">
<City ID="253">鞍山市</City>
<City ID="254">本溪市</City>
<City ID="255">朝阳市</City>
<City ID="256">大连市</City>
<City ID="257">丹东市</City>
<City ID="258">抚顺市</City>
<City ID="259">阜新市</City>
<City ID="260">葫芦岛市</City>
<City ID="261">锦州市</City>
<City ID="262">辽阳市</City>
<City ID="263">盘锦市</City>
<City ID="264">沈阳市</City>
<City ID="265">铁岭市</City>
<City ID="266">营口市</City>
</Province>
<Province ID="19" Name="内蒙">
<City ID="267">阿拉善盟</City>
<City ID="268">巴彦淖尔市</City>
<City ID="269">包头市</City>
<City ID="270">赤峰市</City>
<City ID="271">鄂尔多斯市</City>
<City ID="272">呼和浩特市</City>
<City ID="273">呼伦贝尔市</City>
<City ID="274">通辽市</City>
<City ID="275">乌海市</City>
<City ID="276">乌兰察布市</City>
<City ID="277">锡林郭勒盟</City>
<City ID="278">兴安盟</City>
</Province>
<Province ID="20" Name="宁夏">
<City ID="279">固原市</City>
<City ID="280">石嘴山市</City>
<City ID="281">吴忠市</City>
<City ID="282">博尔塔拉州</City>
<City ID="283">中卫市</City>
<City ID="440">银川市</City>
</Province>
<Province ID="21" Name="青海">
<City ID="284">果洛州</City>
<City ID="285">海北州</City>
<City ID="286">海东地区</City>
<City ID="287">银川市</City>
<City ID="288">海西州</City>
<City ID="289">黄南州</City>
<City ID="290">西宁市</City>
<City ID="291">玉树州</City>
</Province>
<Province ID="22" Name="山东">
<City ID="292">滨州市</City>
<City ID="293">德州市</City>
<City ID="294">东营市</City>
<City ID="295">菏泽市</City>
<City ID="296">济南市</City>
<City ID="297">济宁市</City>
<City ID="298">莱芜市</City>
<City ID="299">聊城市</City>
<City ID="300">临沂市</City>
<City ID="301">青岛市</City>
<City ID="302">日照市</City>
<City ID="303">泰安市</City>
<City ID="304">威海市</City>
<City ID="305">潍坊市</City>
<City ID="306">烟台市</City>
<City ID="307">枣庄市</City>
<City ID="308">淄博市</City>
</Province>
<Province ID="23" Name="山西">
<City ID="309">长治市</City>
<City ID="310">大宁县</City>
<City ID="311">大同市</City>
<City ID="312">晋城市</City>
<City ID="313">晋中市</City>
<City ID="314">临汾市</City>
<City ID="315">吕梁市</City>
<City ID="316">朔州市</City>
<City ID="317">太原市</City>
<City ID="318">忻州市</City>
<City ID="319">阳泉市</City>
<City ID="320">运城市</City>
</Province>
<Province ID="24" Name="陕西">
<City ID="321">安康市</City>
<City ID="322">宝鸡市</City>
<City ID="323">汉中市</City>
<City ID="324">嘉峪关市</City>
<City ID="325">铜川市</City>
<City ID="326">渭南市</City>
<City ID="327">西安市</City>
<City ID="328">咸阳市</City>
<City ID="329">延安市</City>
<City ID="330">榆林市</City>
</Province>
<Province ID="25" Name="上海">
<City ID="331">宝山区</City>
<City ID="332">长宁区</City>
<City ID="333">崇明县</City>
<City ID="334">奉贤区</City>
<City ID="335">虹口区</City>
<City ID="336">黄浦区</City>
<City ID="337">嘉定区</City>
<City ID="338">金山区</City>
<City ID="339">静安区</City>
<City ID="340">卢湾区</City>
<City ID="341">闵行区</City>
<City ID="342">南汇区</City>
<City ID="343">浦东新区</City>
<City ID="344">普陀区</City>
<City ID="345">青浦区</City>
<City ID="346">松江区</City>
<City ID="347">徐汇区</City>
<City ID="348">杨浦区</City>
<City ID="349">闸北区</City>
</Province>
<Province ID="26" Name="四川">
<City ID="350">阿坝藏族羌族自治州</City>
<City ID="351">巴中市</City>
<City ID="352">成都市</City>
<City ID="353">六盘水市</City>
<City ID="354">德阳市</City>
<City ID="355">甘孜藏族自治州</City>
<City ID="356">广安市</City>
<City ID="357">广元市</City>
<City ID="358">乐山市</City>
<City ID="359">凉山彝族自治州</City>
<City ID="360">泸州市</City>
<City ID="361">眉山市</City>
<City ID="362">绵阳市</City>
<City ID="363">内江市</City>
<City ID="364">南充市</City>
<City ID="365">攀枝花市</City>
<City ID="366">遂宁市</City>
<City ID="367">雅安市</City>
<City ID="368">宜宾市</City>
<City ID="369">资阳市</City>
<City ID="370">自贡市</City>
</Province>
<Province ID="27" Name="天津">
<City ID="371">和平区</City>
<City ID="372">河东区</City>
<City ID="373">河西区</City>
<City ID="374">南开区</City>
<City ID="375">河北区</City>
<City ID="376">红桥区</City>
<City ID="377">塘沽区</City>
<City ID="378">汉沽区</City>
<City ID="379">大港区</City>
<City ID="380">东丽区</City>
<City ID="381">西青区</City>
<City ID="382">津南区</City>
<City ID="383">北辰区</City>
<City ID="384">武清区</City>
<City ID="385">宝坻区</City>
<City ID="386">宁河县</City>
<City ID="387">静海县</City>
<City ID="388">蓟县</City>
</Province>
<Province ID="28" Name="西藏">
<City ID="389">阿里地区</City>
<City ID="390">昌都地区</City>
<City ID="391">拉萨市</City>
<City ID="392">商洛市</City>
<City ID="393">那曲地区</City>
<City ID="394">日喀则地区</City>
<City ID="395">山南地区</City>
</Province>
<Province ID="29" Name="新疆">
<City ID="396">阿克苏地区</City>
<City ID="397">阿勒泰地区</City>
<City ID="398">巴音郭楞州</City>
<City ID="399">观塘区</City>
<City ID="400">昌吉州</City>
<City ID="401">哈密地区</City>
<City ID="402">和田地区</City>
<City ID="403">喀什地区</City>
<City ID="404">克拉玛依市</City>
<City ID="405">克孜勒苏州</City>
<City ID="406">塔城地区</City>
<City ID="407">吐鲁番地区</City>
<City ID="408">乌鲁木齐市</City>
<City ID="409">伊犁州</City>
</Province>
<Province ID="30" Name="云南">
<City ID="410">保山市</City>
<City ID="411">楚雄彝族自治州</City>
<City ID="412">大理白族自治州</City>
<City ID="413">德宏傣族景颇族自治州</City>
<City ID="414">迪庆藏族自治州</City>
<City ID="415">红河哈尼族彝族自治州</City>
<City ID="416">昆明市</City>
<City ID="417">丽江市</City>
<City ID="418">临沧市</City>
<City ID="419">怒江傈傈族自治州</City>
<City ID="420">曲靖市</City>
<City ID="421">思茅市</City>
<City ID="422">文山壮族苗族自治州</City>
<City ID="423">西双版纳傣族自治州</City>
<City ID="424">玉溪市</City>
<City ID="425">昭通市</City>
</Province>
<Province ID="31" Name="浙江">
<City ID="426">杭州市</City>
<City ID="427">湖州市</City>
<City ID="428">嘉兴市</City>
<City ID="429">金华市</City>
<City ID="430">丽水市</City>
<City ID="431">宁波市</City>
<City ID="432">衢州市</City>
<City ID="433">绍兴市</City>
<City ID="434">台州市</City>
<City ID="435">温州市</City>
<City ID="436">舟山市</City>
</Province>
<Province ID="32" Name="台湾">
<City ID="437">台湾</City>
</Province>
<Province ID="33" Name="香港">
<City ID="438">香港</City>
</Province>
<Province ID="34" Name="澳门">
<City ID="439">澳门</City>
</Province>
</Root>

Common.js


代码如下:

//省份，城市
var provinceDom = null;
function InItDom(fname) {
var tempdom;
try {
tempdom = new ActiveXObject("Microsoft.XMLDOM");
} catch (e) {
try {
tempdom = document.implementation.createDocument("", "", null);
}
catch (e) {
alert(e.message);
}
}
try {
tempdom.async = false;
tempdom.load(fname);
//alert(tempdom.childNodes.length);
}
catch (e) {
}
return tempdom;
}
function InitProvince(provinceid) {
var province = document.getElementById(provinceid);
province.length = 0;
if (provinceDom == null)
provinceDom = InItDom("../config/Provinces.xml");
if (provinceDom != null) {
var proNodes = provinceDom.childNodes[1].childNodes;
//alert(proNodes.length);
for (var i = 0; i < proNodes.length; i++) {
var tempOption = document.createElement("option");
tempOption.value = proNodes[i].getAttribute("Name");
tempOption.text = proNodes[i].getAttribute("Name");
province.options.add(tempOption);
}
//alert(proNodes[1].getAttribute("Name"));
}
}
function ResetCity(province, cityname) {
var pname=province.value;
var city = document.getElementById(cityname);
city.length = 0;
if (provinceDom == null)
provinceDom = InItDom("../config/Provinces.xml");
if (provinceDom != null) {
// alert(provinceDom.childNodes[1].childNodes.length);
var root = provinceDom.selectNodes("Root")[0];
//Nodes = objXMLDoc.selectNodes("test/test1/test1");
// alert(root.childNodes.length);
for (var i = 0; i < root.childNodes.length; i++) {
if (root.childNodes[i].getAttribute("Name") == pname) {
for (var j = 0; j < root.childNodes[i].childNodes.length; j++) {
var tempOption = document.createElement("option");
tempOption.value = root.childNodes[i].childNodes[j].text;
tempOption.text = root.childNodes[i].childNodes[j].text;
city.options.add(tempOption);

}
break;
}
}
}
}

aspx页面：


代码如下:

<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tr>
<td height="25" width="30%" align="right">
UName ：
</td>
<td height="25" width="*" align="left">
<asp:TextBox ID="txtUName" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td height="25" width="30%" align="right">
UCountry ：
</td>
<td height="25" width="*" align="left">
<asp:TextBox ID="txtUCountry" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td height="25" width="30%" align="right">
UProvince ：
</td>
<td height="25" width="*" align="left">
<asp:DropDownList ID="ddlUProvince" runat="server" onchange="ResetCity(this,'ddlUCity');">
</asp:DropDownList>
</td>
</tr>
<tr>
<td height="25" width="30%" align="right">
UCity ：
</td>
<td height="25" width="*" align="left">
<asp:DropDownList ID="ddlUCity" runat="server">
</asp:DropDownList>
</td>
</tr>
<tr>
<td height="25" colspan="2">
<div align="center">
<asp:Button ID="btnAdd" runat="server" Text="注册" OnClick="btnAdd_Click"></asp:Button>
</div>
</td>
</tr>
</table>
<script>InitProvince('ddlUProvince');</script>

aspx.cs：


代码如下:

string province=Request["ddlUProvince"];
string city=Request["ddlUCity"];