Js + xml generates cascade drop-down box code. If you need code, you can refer to the variable var cityId = city id when you need to select it by default.
Below is the js Code
The Code is as follows:
Function readxml (){
Var XmlDoc = null;
If (window. ActiveXObject ){
XmlDoc = new ActiveXObject ("Microsoft. XMLDOM ");
XmlDoc. async = false;
XmlDoc. load (path + "/web/common/regions. xml ");
Browse = "ie ";
} Else if (document. implementation
& Document. implementation. createDocument ){
XmlDoc = document. implementation. createDocument ('','', null );
XmlDoc. load ("regions. xml ");
Browse = "ff ";
} Else {
Alert ('not compatible with this browser! ');
}
Var root = XmlDoc.doc umentElement;
// Obtain the province node under the root node
Var provinces = root. childNodes;
Var province = document. getElementByIdx_x_x ("province ");
Var cities = document. getElementByIdx_x_x ("regId ");
For (var I = 0; I <provinces. length; I ++ ){
// Obtain the name attribute value of the province Node
Var name = provinces [I]. getAttribute ("name ");
// Create an option
Var opt = document_createElement_x_x ("option ");
// Add text for option
Opt. a (document_createTextNode (name ));
// Add to parent node
If (cityId! = Null & cityId! = ""){
Var citys = provinces [I]. childNodes;
For (var j = 0; j If (citys [j]. getAttribute ("id") = cityId ){
Opt. selected = "selected ";
For (var j = 0; j <citys. length; j ++ ){
// Create an option
Var opt1 = document_createElement_x_x ("option ");
Opt1.value = citys [j]. getAttribute ("id ");
// Add text for option
Opt1.a (document_createTextNode (citys [j]
. GetAttribute ("name ")));
// Add to parent node
If (citys [j]. getAttribute ("id") = cityId ){
Opt1.selected = "selected ";
}
Cities. a (opt1 );
}
}
}
}
Province. a (opt );
}
Province. onchange = function (){
Var pce = document. getElementByIdx_x_x ("province ");
Var opts = pce. options;
Var opt1 = opts [pce. selectedIndex];
Var name = opt1.innerText;
For (var I = 0; I <provinces. length; I ++ ){
// Obtain the name attribute value of the province Node
Var name1 = provinces [I]. getAttribute ("name ");
If (name = name1 ){
Cities. length = 1; // clear each change
Var pros = provinces [I];
Var citys = pros. childNodes;
For (var j = 0; j <citys. length; j ++ ){
// Create an option
Var opt1 = document_createElement_x_x ("option ");
Opt1.value = citys [j]. getAttribute ("id ");
// Add text for option
Opt1.a (document_createTextNode (citys [j]
. GetAttribute ("name ")));
// Add to parent node
Cities. a (opt1 );
}
}
}
}
}
Below is the xml structure
The Code is as follows: