读取xml到下拉列表

     在开发节点物流的平台时有一个下拉列表读取xml的东西,虽然后来被用其他的东西换掉了,可是还要来说一说这个小东东。
首先是根据一个下拉列表的选择:A,货源,B、车源,C、其它

货源对应goods 车源对应truck 其它为others,下面是xml文件

<?xml version="1.0" encoding="gb2312"?>
<Info>
 <goods>
  <sdtys>
   <sdty>钢铁</sdty>
   <sdty>煤炭</sdty>
   <sdty>电力</sdty>
  </sdtys>
  <uoms>
   <uom>吨</uom>
   <uom>立方米</uom>
  </uoms>
 </goods>
 <truck>
  <sdtys>
   <sdty>卡车</sdty>
   <sdty>斯太尔</sdty>
   <sdty>tank</sdty>
  </sdtys>
  <uoms>
   <uom>100/公里</uom>
   <uom>22/小时</uom>
  </uoms>
 </truck>
 <others>
  <sdtys>
   <sdty>其他信息</sdty>
  </sdtys>
  <uoms>
   <uom>个</uom>
   <uom>台</uom>
   <uom>其他</uom>
  </uoms>
 </others>
</Info>

 


数据读取到的下拉列表分别为 类型 和 单位,分别对应上述中sdtys和uoms

然后是html文件,如下
1.信息选择的html代码

  1. <select id="info.tpye" name="info.tpye" onChange = "GetInfo(this.selectedIndex);">   
  2.     <option></option>   
  3.     <option value="A">货源信息</option>   
  4.     <option value="B">车源信息</option>   
  5.     <option value="C">其它信息</option>   
  6. </select>  


下面是最重要的部分了吧,列出我的javascript代码,因为使用到了一个工具包prototype.js,所以$('s')可以使用document.getElementById('s')替代

1.getOptionsText(name)是一个方便我获得options内容的方法

  1. function getOptionsText(name){   
  2.         if($("info.sdty").selectedIndex != -1){   
  3.             return $(name).options[$(name).selectedIndex].text   
  4.         }else{   
  5.             return "";   
  6.         }   
  7.     }  

2.读取xml

  1. function GetInfo(name)   
  2. {   
  3.     $('info.sdty').options.length=0;   
  4.     $('info.uom').options.length=0;   
  5.   
  6.     var info;   
  7.     if(name == 1){   
  8.         info = "goods";   
  9.     }else if(name == 2){   
  10.         info = "truck"  
  11.     }else if(name == 3){   
  12.         info = "others";   
  13.     }else{   
  14.         return;   
  15.     }   
  16.   
  17.     if(window.ActiveXObject){   
  18.         var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");   
  19.         xmlDoc.async = false;   
  20.         xmlDoc.load("data.xml");   
  21.     }else{   
  22.         var parser = new DOMParser();   
  23.         var xmlDoc = parser.parseFromString("data.xml","text/xml");   
  24.     }   
  25.     //var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");   
  26.     //xmlDoc.load("data.xml");   
  27.     //alert(xmlDoc.validateOnParse);   
  28.   
  29.     xmlDoc = xmlDoc.getElementsByTagName(info)[0];   
  30.     var sdtys = xmlDoc.getElementsByTagName('sdty');   
  31.     var uoms = xmlDoc.getElementsByTagName('uom');   
  32.     for(var i=0;i<sdtys.length;i++){   
  33.         //alert(sdtys(i).firstChild.nodeValue);   
  34.         //$('info.sdty').options[i]=new Option(sdtys(i).firstChild.nodeValue,sdtys(i).firstChild.nodeValue);   
  35.         $('info.sdty').add(new Option(sdtys(i).firstChild.nodeValue,sdtys(i).firstChild.nodeValue));   
  36.     }   
  37.     for(var i=0;i<uoms.length;i++){   
  38.         $('info.uom').add(new Option(uoms(i).firstChild.nodeValue,uoms(i).firstChild.nodeValue));   
  39.     }   
  40.   
  41. }  

我并没有删除掉注释代码是因为曾经碰到了一个问题,开始我是用如下方法来做的

xmlDoc.load("data.xml");  

然后被报告说xml不可读取的信息,后来我加入了一个alert
alert(xmlDoc.validateOnParse);  
validateOnParse的作用是告诉解析器文件是否有效
说明:此属性是可擦写的。如果传回值为true,表示文件被解析时被确认是有效的。如果传回false,表示文件是无效的,并被认为只是标准格式的(well-formed)文件。
弹出的时true,然后xml也可以读取到下拉列表,手动设置它为true,xml却依然不能读取,凭着一点经验,把xml文件设置为非异步
xmlDoc.async = false;  
结果OK了。不多解释,async还是很重要的一个属性,幸好使用Ajax做过一些东西。这个问题还算是没费太多功夫。
最后来个图片吧。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值