利用xml数据岛实现多级关联下拉选择框的做法

[入库:2005年8月18日] [更新:2007年3月24日]

本文简介:选择自 qiushuiwuhen 的 blog

<select name=year></select>
<select name=month></select>
<select name=date></select>
<select name=clock></select>
<input name=result>

<script>
var arrsel=["year","month","date","clock"];//arrsel定义了要修改的下拉框和xml数据的节点名称
</script>

<xml id=xmldata>
 <xmldata>
  <year value="2000">
   <month value="4">
    <date value="14">
     <clock value="一点" />
     <clock value="三点" />
    </date>
    <date value="17">
     <clock value="一点" />
    </date>
   </month>
   <month value="5">
    <date value="15">
     <clock value="一点" />
     <clock value="四点" />
     <clock value="七点" />
    </date>
   </month>
  </year>
  <year value="2001">
   <month value="7">
    <date value="16">
     <clock value="一点" />
     <clock value="五点" />
     <clock value="九点" />
    </date>
   </month>
  </year>
 </xmldata>
</xml>

<script>
function qswhxml(num){
/******* by qiushuiwuhen(2002-5-17) ********/
 var i,j,arrtemp=[];
 for(i=0;i<num;i++)arrtemp[i]=document.all(arrsel[i]).options[document.all(arrsel[i]).selectedindex].text
 if(num==arrsel.length){//这里处理最后的数据。
  document.all("result").value="选中了("+arrtemp+")";return;
 }
 with(document.all(arrsel[num])){
  length=0
  var obj=document.all.xmldata.xmldocument.childnodes[0];
  for(i=0;i<num;i++)obj=obj.selectsinglenode(arrsel[i]+'[@value="'+arrtemp[i]+'"]');
  for(i=0;i<obj.childnodes.length;i++)options[length++].text=obj.childnodes[i].getattribute("value");
  onchange=new function("qswhxml("+(num+1)+")");
  onchange();
 }
}
qswhxml(0);
</script>

 

秋水无恨 :)

本文关键:多级关联 xml数据岛
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top