HTML代码:
1.<div>
2. <select id="father_name" onchange="ShowCity(this)">
3. <option value="" selected="selected" >--请选择省份--</< span>option>
1. <option value="江苏">江苏</< span>option>
1. <option value="浙江">浙江</< span>option>
1. </< span>select>
1.
2. <select id="son_name">
3. <option>--请选择城市--</< span>option>
1. </< span>select>
1. </< span>div>
XML文件:
1.<country>
2. <province attr="江苏">
3. <city>徐州</< span>city>
1. <city>南京</< span>city>
1. </< span>province>
1. <province attr="浙江">
2. <city>杭州</< span>city>
1. <city>湖州</< span>city>
1. </< span>province>
1.</< span>country>
js:
1.function ShowCity(province)
2. {
3. //清空下拉框的值
4. document.getElementByIdx("son_name").length=0;
5. document.getElementByIdx("son_name").options[0] = new Option("--请选择城市--","");
6.// 或者循环清空
1.// for(var i = document.getElementByIdx("son_name").length - 1; i > 0; i--) {
1.// document.getElementByIdx("son_name").remove(document.getElementByIdx("son_name").options[i]);
1.// }
1. //得到选中的省份
2. var selectprovince = province.options[province.selectedIndex].value;
3.
4. var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
5. xmlDoc.async = false;
6. xmlDoc.load("XMLFile.XML");
7.
8. //得到xml中的所有省份
9. var provincexml =xmlDoc.documentElement.childNodes;
10.
11. //循环判断哪个是你选中的
12. for(i=0;i
1. {
2. if(provincexml[i].attributes[0].value == selectprovince)
3. {
4. //给下拉框循环添加市
5. for(j = 0;j < provincexml[i].childNodes.length; j++)
6. {
7. var city = provincexml[i].childNodes[j].text;
8.
9. document.getElementByIdx("son_name").options[document.getElementByIdx("son_name").length] = new Option(city,city);
10. }
11. break;
12. }
13. }
14. }