ajax读取XML文本(如读取城市)-优快云博客

本文介绍了一种利用XML文件与AJAX技术来动态加载城市及其下属地区的方案。通过解析XML数据，实现了下拉框中省份及对应城市的动态展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//加载城市
function loadArea_pep() {
    $.ajax({
        url: "/xmlFile/crty.xml",
        success: function (result) {
            var item = "<option value='-1'>--不限--</option>";
            $(result).find("State").each(function () {
                item += "<option value=" + $(this).attr("Code") + " >" + $(this).attr("Name") + "</option>"
            })//end each
            $("#WordAddersMax").html(item);
        }
    })// end ajax
}


//加载地区
function loadCityat_pep(parentid) {
    $.ajax({
        url: "/xmlFile/crty.xml",
        success: function (result) {
            var item = "<option value='-1'>--不限--</option>";
            $(result).find("State").each(function () {

                if ($(this).attr("Code") == parentid) {
                    $(this).find("City").each(function () {
                        item += "<option value=" + $(this).attr("Code") + " >" + $(this).attr("Name") + "</option>";
                    })// each end                  
                }
            })//end each
            $("#WordAddersMin").html(item);
        }
    })// end ajax
}

XML文档如

<?xml version="1.0" encoding="utf-8"?>
<Location>
  <State Name="北京" Code="11">
    <City Name="东城" Code="1"/>
    <City Name="西城" Code="2"/>
    <City Name="崇文" Code="3"/>
    <City Name="宣武" Code="4"/>
    <City Name="朝阳" Code="5"/>
  </State>
  <State Name="天津" Code="12">
    <City Name="和平" Code="1"/>
    <City Name="河东" Code="2"/>
    <City Name="河西" Code="3"/>
    <City Name="南开" Code="4"/>
    <City Name="河北" Code="5"/>
    <City Name="红桥" Code="6"/>
  </State>