楼主的XML定义最好改为：
<root>
<loc code="guangdong" name="广东" parent="" />
<loc code="guangzhou" name="广州" parent="guangdong" />
</root>这样读取的时候用 var xmldoc = new ActiveXObject("MSXML2.DOMDocument");
xmldoc.async = false;
xmldoc.load("locallist.xml");
var nodes = xmldoc.selectNodes('/root/loc');
if(nodes) {
var parent = '';
var code = '';
var name = '';
var node;
for(var i=0; i<nodes.length; i++) {
node = nodes.item(i);
code = node.attributes.getNamedItem("id").nodeValue;
parent = node.attributes.getNamedItem("parent").nodeValue;
name = node.attributes.getNamedItem("name").nodeValue;
// 剩下的要做级联菜单还是请其他高手来吧
}
}
<root>
<loc code="guangdong" name="广东" parent="" />
<loc code="guangzhou" name="广州" parent="guangdong" />
</root>这样读取的时候用 var xmldoc = new ActiveXObject("MSXML2.DOMDocument");
xmldoc.async = false;
xmldoc.load("locallist.xml");
var nodes = xmldoc.selectNodes('/root/loc');
if(nodes) {
var parent = '';
var code = '';
var name = '';
var node;
for(var i=0; i<nodes.length; i++) {
node = nodes.item(i);
code = node.attributes.getNamedItem("id").nodeValue;
parent = node.attributes.getNamedItem("parent").nodeValue;
name = node.attributes.getNamedItem("name").nodeValue;
// 剩下的要做级联菜单还是请其他高手来吧
}
}
for(...遍历
选择某省所有市或地区：
xml_dom.selectNodes("//list[@code='" + 省代码 + "']/list");
or
xml_dom.selectNodes("//list[@name='" + 省名称 + "']/list");
for(...遍历
选择某省某市或地区所有县：
xml_dom.selectNodes("//list[@code='" + 省代码 + "']/list[@code='" + 市或地区代码 + "']/list");
or
xml_dom.selectNodes("//list[@name='" + 省名称 + "']/list[@name='" + 市或地区名称 + "']/list");
for(...遍历
选择某省某市或地区单个县：xml_dom.selectSingleNode("//list[@code='" + 省代码 + "']/list[@code='" + 市或地区代码 + "']/list[@code='" + 县代码 + "']");
or
xml_dom.selectSingleNode("//list[@name='" + 省名称 + "']/list[@name='" + 市或地区名称 + "']/list[@name='" + 县名称 + "']");
<html>
<head>
<xml id="xml1">
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<root code="root">
<list code="guangdong" name="广东">
<list code="yunfu" name="云浮">
<list code="luodingshi" name="罗定市" />
<list code="yyfunanxian" name="云安县" />
<list code="yunanxian" name="郁南县" />
<list code="xinxingxian" name="新兴县" />
<list code="yunchengqu" name="云城区" />
</list>
<list code="chaozhou" name="潮州">
<list code="raopingxian" name="饶平县" />
<list code="caoanxian" name="潮安县" />
<list code="xiangqiaoqu" name="湘桥区" />
</list>
</list>
<list code="hunan" name="湖南">
<list code="xiangxi" name="湘西土家族苗族">
<list code="longshanxian" name="龙山县" />
<list code="yongshunxian" name="永顺县" />
</list>
<list code="loudi" name="娄底">
<list code="lianyuanshi" name="涟源市" />
<list code="lengshuijiangshi" name="冷水江市" />
</list>
</list>
<list code="hubei" name="湖北">
<list code="hubeishenzhixia" name="湖北省直辖">
<list code="shennongjialingqu" name="神农架林区" />
<list code="tianmenshi" name="天门市" />
<list code="xiantaoshi" name="仙桃市" />
</list>
<list code="enshitujia" name="恩施土家族苗族">
<list code="hefengxian" name="鹤峰县" />
<list code="laifengxian" name="来凤县" />
</list>
</list>
</root>
</xml>
<script language="javascript"> var xmldoc = document.getElementById("xml1");
function loadRoot(){
var nodes = xmldoc.selectNodes('/root/list');
if(nodes) {
var oSelect = document.getElementById("select1");
for(var i=0; i<nodes.length; i++) {
node = nodes.item(i);
var oOption = document.createElement("OPTION");
oOption.text= node.attributes.getNamedItem("name").nodeValue;
oOption.value=node.attributes.getNamedItem("code").nodeValue;
oSelect.add(oOption);
}
}
}
function change1(){
var obj = event.srcElement;
var node1 = xmldoc.selectSingleNode("/root/list[@code='"+obj.value+"']");
var nodes = node1.childNodes; var oSelect = document.getElementById("select2");
// 省略清空 select
for(var i=0; i<nodes.length; i++) {
node = nodes.item(i);
var oOption = document.createElement("OPTION");
oOption.text= node.attributes.getNamedItem("name").nodeValue;
oOption.value=node.attributes.getNamedItem("code").nodeValue;
oSelect.add(oOption);
}
}
function change2(){
// 同 change1
}</script>
</head><body onload="loadRoot()">
<select id="select1" onchange="change1()"></select>
<select id="select2" onchange="change2()"></select>
<select id="select3"></select>
</body>
</html>
html页面：<html>
<head>
<script>
var doc = new ActiveXObject("Microsoft.XMLDOM");
doc.async="false";
doc.load("data.xml");function DisplayCity(province)
{
if(province != "")
{
var province = doc.selectSingleNode("//list[@code='" + province + "']");
var citys = province.childNodes;
var citySelect = document.getElementById("city");
citySelect.options.length = 1;
for(var i=0; i<citys.length; i++)
{
var city=citys[i];
var cityName=city.getAttribute("name");
var cityCode=city.getAttribute("code");
var option=new Option(cityName, cityCode);
citySelect.options.add(option);
}
}
else
{
document.getElementById("city").options.length = 1;
document.getElementById("county").options.length = 1;
}
}
function DisplayCounty(city)
{
if(city != "")
{
var city = doc.selectSingleNode("//list/list[@code='" + city + "']");
var countys = city.childNodes;
var countySelect = document.getElementById("county");
countySelect.options.length = 1;
for(var i=0; i<countys.length; i++)
{
var county=countys[i];
var countyName=county.getAttribute("name");
var countyCode=county.getAttribute("code");
var option=new Option(countyName, countyCode);
countySelect.options.add(option);
}
}
else
{
document.getElementById("county").options.length = 1;
}
}
</script>
</head>
<body>
<select id= "province" style="width:100px" onchange="DisplayCity(this.value);">
<option value=""></option>
<option value="guangdong">广东</option>
<option value="hunan">湖南</option>
<option value="hubei">湖北</option>
</select>
<select id= "city" style="width:100px" onchange="DisplayCounty(this.value);">
<option value=""></option>
</select>
<select id= "county" style="width:100px">
<option value=""></option>
</select>
</body>
</html>xml文件<?xml version="1.0" encoding="GB2312" standalone="yes"?>
<root code="root">
<list code="guangdong" name="广东">
<list code="yunfu" name="云浮">
<list code="luodingshi" name="罗定市" />
<list code="yyfunanxian" name="云安县" />
<list code="yunanxian" name="郁南县" />
<list code="xinxingxian" name="新兴县" />
<list code="yunchengqu" name="云城区" />
</list>
<list code="chaozhou" name="潮州">
<list code="raopingxian" name="饶平县" />
<list code="caoanxian" name="潮安县" />
<list code="xiangqiaoqu" name="湘桥区" />
</list>
</list>
<list code="hunan" name="湖南">
<list code="xiangxi" name="湘西土家族苗族">
<list code="longshanxian" name="龙山县" />
<list code="yongshunxian" name="永顺县" />
</list>
<list code="loudi" name="娄底">
<list code="lianyuanshi" name="涟源市" />
<list code="lengshuijiangshi" name="冷水江市" />
</list>
</list>
<list code="hubei" name="湖北">
<list code="hubeishenzhixia" name="湖北省直辖">
<list code="shennongjialingqu" name="神农架林区" />
<list code="tianmenshi" name="天门市" />
<list code="xiantaoshi" name="仙桃市" />
</list>
<list code="enshitujia" name="恩施土家族苗族">
<list code="hefengxian" name="鹤峰县" />
<list code="laifengxian" name="来凤县" />
</list>
</list>
</root>
就是说我想这样：
var xmldoc=new ActiveXObject("microsoft.xmldom");
xmldoc.async="false";
xmldoc.load("AreaCity.xml");
这样读取省可以，可我对js实在一窍不通，接下来的联动就不会了！
<html>
<head>
<title> changeType </title>
<script type="text/javascript">
var xmlDoc;
var XMLPath="three.xml";//文件路径
var sec=[];//2级菜单数组
var thr=[];//3级菜单数组
window.onload=function()
{
if(window.ActiveXObject)//ie
{
try
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
catch(e2)
{}
if(!xmlDoc)
{
alert("创建对象失败！");
return;
}
xmlDoc.onreadystatechange=function()
{
if(xmlDoc.readyState==4)
{
getArray();
}
}
xmlDoc.load(XMLPath);
}
else if(document.implementation&&document.implementation.createDocument)//ff和2级DOM
{
xmlDoc=document.implementation.createDocument('','',null);
xmlDoc.onload=getArray;
xmlDoc.load(XMLPath);
}
}
function getArray()
{
var first=document.getElementById("first");
var second=document.getElementById("second");
var three=document.getElementById("three");
var root=xmlDoc.getElementsByTagName("root")[0];
var op;
//=================注意下面的遍历，在ff时空格也算一个节点=======================
var InitSec=false,InitThr=false;
for(var i=0;i<root.childNodes.length;i++)//=======遍历1级节点
{
var curNode=root.childNodes[i];
if(curNode.nodeType==3) continue;//如果为文本节点，继续
var code=curNode.getAttribute("code");
var name=curNode.getAttribute("name");
sec[code]=new Array();
first.options.add(new Option(name,code));//添加1级菜单
for(var j=0;j<curNode.childNodes.length;j++)//=======遍历2级节点
{
var curNode1=curNode.childNodes[j];
if(curNode1.nodeType==3) continue;//如果为文本节点，继续
var code1=curNode1.getAttribute("code");
var name1=curNode1.getAttribute("name");
thr[code1]=new Array();
op=new Option(name1,code1);
if(!InitSec)
{
second.options.add(op);//添加2级菜单
}
sec[code].push(op);//添加进入数组
for(var k=0;k<curNode1.childNodes.length;k++)//=======遍历3级节点
{
var curNode2=curNode1.childNodes[k];
if(curNode2.nodeType==3) continue;//如果为文本节点，继续
var code2=curNode2.getAttribute("code");
var name2=curNode2.getAttribute("name");
op=new Option(name2,code2);
if(!InitThr)
{
three.options.add(op);//添加3级菜单
}
thr[code1].push(op);//添加进入数组
}
}
//设置2，3级菜单已经初始化过
InitSec=true;
InitThr=true;
}
}
function getSecond(value)
{
var FirstValue="";//初始化3级菜单用的
var s=document.getElementById("second");
s.options.length=0;//清除所有option
for(var i=0;i<sec[value].length;i++)
{
if(i==0)
FirstValue=sec[value][i].value;
s.options.add(sec[value][i]);
}
getThree(FirstValue);//获取第3级菜单
}
function getThree(value)
{
var s=document.getElementById("three");
s.options.length=0;//清除所有option
for(var i=0;i<thr[value].length;i++)
{
s.options.add(thr[value][i]);
}
}
</script>
</head>
<body>
<select id="first" onchange='getSecond(this.value)'></select>
<select id="second" onchange='getThree(this.value)'></select>
<select id="three"></select>
</body>
</html>
我这怎么有错，而且根本没绑定上？
//文件路径========这里你改了没有??把这里改为你的路径,而且名称要注意
var XMLPath="three.xml";
three.xml
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<root code="root">
<list code="guangdong" name="广东">
<list code="yunfu" name="云浮">
<list code="luodingshi" name="罗定市" />
<list code="yyfunanxian" name="云安县" />
<list code="yunanxian" name="郁南县" />
<list code="xinxingxian" name="新兴县" />
<list code="yunchengqu" name="云城区" />
</list>
<list code="chaozhou" name="潮州">
<list code="raopingxian" name="饶平县" />
<list code="caoanxian" name="潮安县" />
<list code="xiangqiaoqu" name="湘桥区" />
</list>
</list>
<list code="hunan" name="湖南">
<list code="xiangxi" name="湘西土家族苗族">
<list code="longshanxian" name="龙山县" />
<list code="yongshunxian" name="永顺县" />
</list>
<list code="loudi" name="娄底">
<list code="lianyuanshi" name="涟源市" />
<list code="lengshuijiangshi" name="冷水江市" />
</list>
</list>
<list code="hubei" name="湖北">
<list code="hubeishenzhixia" name="湖北省直辖">
<list code="shennongjialingqu" name="神农架林区" />
<list code="tianmenshi" name="天门市" />
<list code="xiantaoshi" name="仙桃市" />
</list>
<list code="enshitujia" name="恩施土家族苗族">
<list code="hefengxian" name="鹤峰县" />
<list code="laifengxian" name="来凤县" />
</list>
</list>
</root>