Кода -копия выглядит следующим образом:
<! Doctype html public "-// w3c // dtd html 4.01 Transitional // en">
<html>
<голова>
<title> menu2level.html </title>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<script type = "text/javascript">
function loadxml () {
var xmldoc;
пытаться{
// т.е.
xmldoc = new ActivexObject ("microsoft.xmldom");
} catch (e) {
пытаться{
xmldoc = document.implementation.createdocument ("", "", null);
} catch (e) {
предупреждение (e.message);
возвращаться;
}
}
xmldoc.async = false;
xmldoc.load ("cities.xml");
вернуть Xmldoc;
}
// Загрузка веб -страницы завершена после загрузки, а провинция загружается.
OnLoad = function () {
var xmldocument = loadxml ();
var provincearr = xmldocument.getelementsbytagname ("провинция");
var proSize = provincearr.length;
для (var i = 0; i <propize; i ++) {
// Создать узел опции
var intecialElement = document.createElement ("опция");
var provinceName = provincearr [i] .getattribute ("name");
// Создать текстовый узел
var textElement = document.createTextNode (провинция);
intecialElement.appendchild (TextElement);
intainationelement.setAttribute ("value", ProvinceName);
var node = document.getElementById ("провинция");
node.appendChild (OptactionElement);
}
}
// Мероприятие по изменению провинции
Function изменение province (node) {
// Получите выбранную угловую марку
var index = node.selectedIndex;
// Получить соответствующую имя провинции
var provinceename = node.options [index] .value;
Loadcities (имя провинции);
}
// Загрузите информацию о городе в соответствии с номером провинции
Функция LoadCities (neame) {
var xmldocument = loadxml ();
var provincearr = xmldocument.getelementsbytagname ("провинция");
// Получить элементы города
var CitySelectele = document.getElementById ("Cities");
var size = cityselectele.options.length;
для (var i = size; i> 0; i-) {
CitySelectele.remove (i);
}
// Получить количество провинций
var proSize = provincearr.length;
var Proelement;
// Получить соответствующий элемент провинции
для (var i = 0; i <propize; i ++) {
if (provincearr [i] .getattribute ("name") == neame) {
proelement = provincearr [i];
перерыв;
}
}
// Получить городскую информацию о провинции
var CitiesArr = proelement.getElementsbytagname ("City");
var len = citiesarr.length;
для (var i = 0; i <len; i ++) {
// Создать узел опции
var intecialElement = document.createElement ("опция");
// Получить название города
var CityName = CitiesArr [i] .firstchild.nodevalue;
// Создать текстовый узел
var textElement = document.createTextNode (CityName);
intecialElement.appendchild (TextElement);
intecialElement.setattribute ("Value", CityName);
CitySelectele.AppendChild (OtactionElement);
}
}
функция getValue () {
var pro = document.getElementbyId ("провинция"). Значение;
var city = document.getelementbyid ("города"). Значение;
оповещение (Pro+":"+City);
}
</script>
</head>
<тело>
<select id = "провинция" onchange = "changeprovince (this)">
<option value = "" selected = "selected">-провинция-</option>
</select>
<select id = "города">
<option value = "" selected = "selected">-city-</option>
</select>
<input type = "button" value = "op Up" onclick = "getValue ()"/>
</body>
</html>
Эффекты следующие:
http://img.blog.csdn.net/20140315235043343?watermark/2/ext/ahr0cdovl2jsb2cuy3nkbi5uzxqvbgl1agvuz2h1atuymde=/font/5a6l5l2t/fontsi Ze/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/400/ olve/70/гравитация/юго -восток
Файл Cities.xml выглядит следующим образом:
Кода -копия выглядит следующим образом:
<? xml version = "1.0" Encoding = "UTF-8"?>
<xml-body>
<провинция name = "shaanxi">
<Сити> xi'an </city>
<Сити> Ханчхон </city>
<Сити> Баоджи </city>
<City> yan'an </city>
</провинция>
<провинция name = "guangdong">
<Сити> Фошан </city>
<Сити> Шэньчжэнь </city>
<Сити> Гуанчжоу </city>
<Сити> Шанту </city>
</провинция>
<провинция name = "liaoning">
<Сити> Далянинг </city>
<City> Tieling </city>
<Сити> Аншан </city>
<City> fushun </city>
</провинция>
</xml-body>