解析xml文件，然后将城市列表还原到下拉列表框中；当选择下拉列表框时，在对应的文本框中显示该城市信息。
前端代码：
<!doctype html> <html> <head> <meta charset="utf-8"> <title>jQuery ajax解析xml文件demo</title> <script type="text/javascript" src="jquery.min.js"></script> </head> <body> <input type="button" value="加载xml文件" onClick="cityajax();this.disabled = true;"><br> 城市列表: <select id="list"> </select> <br> 城市信息： <textarea id="texts"></textarea> <script> function cityajax(){ var olist=$("#list"); var otext=$("#texts"); var arr=new Array(); $.ajax({ url:"/city_xml/XML/city.xml", type:"POST", dataType:'xml', success:function(xml){ $(xml).find("City").each(function(i) { //获取城市名字 var cityName=$(this).attr("Name"); //添加到下拉框,设置内容 $("<option></option>").appendTo(olist).text(cityName); //获取城市信息，并存入数组中 var cityText=$(this).find("Description").text(); arr[i]=cityText; changetext(); }); }, error:function(){ alert("加载失败"); } }) //选择不同城市对应信息发生改变 function changetext(){ var _index=olist.find("option:selected").index(); otext.text(arr[_index]); } olist.change(changetext) } </script> </body> </html>
xml文件：
<?xml version="1.0" encoding="gb2312"?> <CityList> <City Name="北京"> <Description>京有着三千余年的建城史和八百五十余年的建都史...</Description> </City> <City Name="上海"> <Description>上海，中国大陆第一大城市；四个中央直辖市之一</Description> </City> <City Name="广州"> <Description>广州，简称穗，别称羊城、穗城、穗垣、仙城、花城；解放前旧称省城。</Description> </City> <City Name="成都"> <Description>位于四川省中部，是中西部地区重要的中心城市。西南地区科技中心、商贸中心、金融中心和交通通信枢纽。</Description> </City> <City Name="沈阳"> <Description>沈阳，辽宁省省会，中国15个副省级城市之一，中国七大区域中心城市之一</Description> </City> </CityList>
代码在ie8及以下版本xml加载失败。哪位朋友有好的意见欢迎提出。