有两个下拉框
<select id="diqu" οnchange="getyiyuan(this.value)"></select><br />
<select id="yiyuan"></select>
脚本如下:
function getdiqu()
{xmlobj = CreateXMLDOM();
//xmlobj = new ActiveXObject("MSXML2.DOMDocument");
xmlobj.load ("XMLFile.xml");
var diqu=document.getElementById("diqu");
var list = xmlobj.selectNodes("/root/diqu");
for(i=0;i<list.length;i++)
{
var option = document.createElement('option');
option.value = list.item(i).selectNodes('@value')[0].text;
option.innerHTML =list.item(i).selectNodes('@name')[0].text;
diqu.appendChild(option);
}
}
function getyiyuan(diqu)
{//需要清空下拉框.要不内容重叠
var yiyuan=document.getElementById("yiyuan");
yiyuan.length=0;
var option = document.createElement('option');
option.value = 0;
option.innerHTML ="请选择";
yiyuan.appendChild(option);
yiyuan.options.item='';
//获得地区所有的
var list = xmlobj.selectNodes("/root/diqu");
//alert(list.item(3).selectNodes('@value')[0].text);
for(i=0;i<list.length;i++)
{
//如果是所选地区,循环下面的医院
var yiyuanlist=list.item(i).selectNodes('yiyuan');
if(diqu==list.item(i).selectNodes('@value')[0].text)
{
for(j=0;j<yiyuanlist.length;j++)
{
var option = document.createElement('option');
option.value = list.item(i).selectNodes('yiyuan')[j].text;
option.innerHTML =list.item(i).selectNodes('yiyuan')[j].text;
yiyuan.appendChild(option);
}
}
}
}
xml文件如下
<?xml version="1.0" encoding="utf-8" ?>
- <root>
- <diqu name="张家口" value="zjk">
<yiyuan>第一附属医院</yiyuan>
<yiyuan>二五一</yiyuan>
</diqu>
- <diqu name="承德" value="cd">
<yiyuan>承德第一医院</yiyuan>
<yiyuan>承德第二医院</yiyuan>
</diqu>
- <diqu name="廊坊" value="lf">
<yiyuan>廊坊第一医院</yiyuan>
<yiyuan>廊坊第二医院</yiyuan>
</diqu>
- <diqu name="石家庄" value="sjz">
<yiyuan>石家庄二院</yiyuan>
<yiyuan>石家庄三院</yiyuan>
</diqu>
</root>