另外发现有人说用树的方式会更灵活和方便，如图

?

?

花了半天时间实现一个多级联动下拉框，目的是对某一植物进行“门纲目科属”的归类。使用的技术是javascript+xml，之所以不用数据库，一来这 方面的数据虽然量大但都是固定不变的，二来不希望加重服务器的负担，第三是因为这种多级从属关系的数据不太适合放在数据库里。

这是大概的思路：
1、读取xml文件
2、当一个下拉框选中某选项时，根据该选项，当前节点指向下一层，进入下一层下拉框的设置
3、取消当前下拉框的禁用，禁用下一层的下拉框
4、清空当前下拉框的选项
5、根据当前节点读取xml的数据，设置下拉框选项
6、返回步骤2

代码：
JavaScript

Javascript代码 ?

1. var ?xmlDoc;????
2. var ?browserType;??
3. var ?currentNode; //当前所在节点 ??
4. ??
5. setBrowserType();??
6. loadXml("classify.xml" );??
7. ??
8. //读取xml文件数据并设置门、纲、目、科、属的下拉框 ??
9. ??
10. //设置“门”的下拉框 ??
11. function ?setPhylum(){??
12. ????currentNode=xmlDoc.documentElement;??
13. ????var ?phylums=xmlDoc.documentElement.childNodes;??
14. ????var ?phylumName;??
15. ????if (browserType== "IE" ){??
16. ????????for ( var ?i=0;i<phylums.length;i++){??
17. ????????????//从门到属，都有name属性标签，并且所有下拉框选项索引都是从1开始 ??
18. ????????????phylumName=phylums[i].selectNodes("name" )[0].text;??
19. ????????????document.forms[0].phylum.options[i+1]=new ?Option(phylumName,phylumName);??
20. ????????}??
21. ????}??
22. ????else { //FF ??
23. ????????//FireFox没有selectNodes()方法，且其childNodes的对应索引是1,3,5,7... ??
24. ????????for ( var ?i=1;i<phylums.length;i=i+2){??
25. ????????????phylumName=phylums[i].childNodes[1].textContent;??
26. ????????????document.forms[0].phylum.options[(i+1)/2]=new ?Option(phylumName,phylumName);??
27. ????????}??
28. ????????document.forms[0].clazz.disabled="disabled" ;??
29. ????????document.forms[0].order.disabled="disabled" ;??
30. ????????document.forms[0].family.disabled="disabled" ;??
31. ????????document.forms[0].genus.disabled="disabled" ;??
32. ????}??
33. }??
34. ??
35. //设置“纲”的下拉框 ??
36. function ?setClazz(selectedIndex){??
37. ????//取消下拉框的禁用 ??