用于显示多极联动菜单的内容

cs.js内容如下：

<!--
/**
 * Function to setup a CascadeSelect
 * @version build 20060324
 * @author  KimSoft (jinqinghua [at] gmail.com)
 * @update
 */

/**
 * setupCascadeSelect
 * @param cascadeSelect select object
 * @param parent data index of parent
 * @param nodes array contains data with structure [[parent, text, value],[],...[]]
 * @param [optional] is onchange
 */
function setupCascadeSelect(cascadeSelect, parent, nodes, isOnChange) {
  if (isOnChange == null){
    isOnChange = false;
  }
  cascadeSelect.onchange = function (){
    setupCascadeSelect(this, this.options[this.selectedIndex].value, nodes, true);
  };
  cascadeSelect.getAttr = function (attrName) {
    return this[attrName] ? this[attrName] : this.getAttribute(attrName);
  };
  cascadeSelect.getElementById = function (id) {
    return this.form.elements[id] ? this.form.elements[id]: document.getElementById(id);
  };
  cascadeSelect.setDisplayStyle = function(value) {
    if (!this.multiple){
      this.style.display = value;
    }
    var subElement = this.getElementById(this.getAttr("subElement"));
    if (subElement != undefined){
      subElement.setDisplayStyle = this.setDisplayStyle;
    }
  };
  nodes.getChildNodesByParent = function (parent) {
    var childNodes = new Array();
    if (parent + "" == ""){
      return childNodes;
    }
    for (var i = 0; i < nodes.length; i++){
      if (nodes[i][0] != undefined && nodes[i][0] == parent){
        childNodes[childNodes.length] = nodes[i];
      }
    }
    return childNodes;
  }

  if(!isOnChange){
    cascadeSelect.options.length = 0;
    var defaultText = cascadeSelect.getAttr("defaultText");
    var defaultValue = cascadeSelect.getAttr("defaultValue");
    var selectedValue = cascadeSelect.getAttr("selectedValue");

    if (defaultText != undefined && defaultValue != undefined){
      cascadeSelect.options[cascadeSelect.options.length] = new Option(defaultText, defaultValue);
    }
    var childNodes = nodes.getChildNodesByParent(parent);
    for (var i = 0; i < childNodes.length; i++){
      cascadeSelect.options[cascadeSelect.options.length] = new Option(childNodes[i][1], childNodes[i][2]);
      if (selectedValue != undefined && selectedValue == childNodes[i][2]){
        cascadeSelect.selectedIndex = cascadeSelect.options.length - 1;
      }
    }
  }

  if (cascadeSelect.options.length > 0){
    cascadeSelect.setDisplayStyle("");
    var subElement = cascadeSelect.getElementById(cascadeSelect.getAttr("subElement"));
    if (subElement != undefined){
      setupCascadeSelect(subElement, cascadeSelect.options[cascadeSelect.selectedIndex].value, nodes, false);
    }
  } else {
    cascadeSelect.setDisplayStyle("none");
  }
}

/**
 * 以类的方法实现连动
 */
function CascadeSelect(element, parent, nodes){
  this.form = element.form;
  this.nodes = nodes;
  this.attributes = {
    "subElement"    : "subElement",
    "defaultText"   : "defaultText",
    "defaultValue"  : "defaultValue",
    "selectedValue" : "selectedValue"
  }
  this.build(element, parent, false);
}

CascadeSelect.prototype.getElementById = function (id) {
    return this.form.elements[id] ? this.form.elements[id]: document.getElementById(id);
};

CascadeSelect.prototype.getAttribute = function (element, attrName) {
    return element[attrName] ? element[attrName] : element.getAttribute(attrName);
};

CascadeSelect.prototype.getChildNodesByParent = function (parent) {
    var childNodes = new Array();
    if (parent + "" == ""){
      return childNodes;
    }
    for (var i = 0; i < this.nodes.length; i++){
      if (this.nodes[i][0] != undefined && this.nodes[i][0] == parent){
        childNodes[childNodes.length] = this.nodes[i];
      }
    }
    return childNodes;
  }

CascadeSelect.prototype.setDisplayStyle = function(element, value) {
  var cs = this;
    if (!element.multiple){
      element.style.display = value;
    }
    var subElement = this.getElementById(this.getAttribute(element, this.attributes["subElement"]));
    if (subElement != undefined){
      subElement.setDisplayStyle = function () {cs.setDisplayStyle;}
    }
  };

CascadeSelect.prototype.build = function (element, parent, isOnChange) {
  var cs = this;
  element.onchange = function () {
    cs.build(this, this.options[this.selectedIndex].value, true);
  }
  if(!isOnChange){
    element.options.length = 0;
    var defaultText = this.getAttribute(element, this.attributes["defaultText"]);
    var defaultValue = this.getAttribute(element, this.attributes["defaultValue"]);
    var selectedValue = this.getAttribute(element, this.attributes["selectedValue"]);
 //alert(selectedValue);

    if (defaultText != undefined && defaultValue != undefined){
      element.options[element.options.length] = new Option(defaultText, defaultValue);
    }
    var childNodes = this.getChildNodesByParent(parent);
    for (var i = 0; i < childNodes.length; i++){
      element.options[element.options.length] = new Option(childNodes[i][1], childNodes[i][2]);
   //alert("childNodes[i][2]:" + childNodes[i][2]);
      if (selectedValue != undefined && selectedValue == childNodes[i][2]){
  alert(selectedValue);
        element.selectedIndex = element.options.length - 1;
      }
    }
  }

  if (element.options.length > 0){
    this.setDisplayStyle(element, "");
    var subElement = this.getElementById(this.getAttribute(element, this.attributes["subElement"]));
    if (subElement != undefined){
      this.build(subElement, element.options[element.selectedIndex].value, false);
    }
  } else {
    this.setDisplayStyle(element, "none");
  }
}
//-->

测试的例子如下：（包含狂多的数据，到时候一定不实用，那些开发人员一定受不了）

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Select联系演示程序</title>
<script language="JavaScript" type="text/JavaScript" src="cs.js"></script>
<script language="JavaScript" type="text/JavaScript">
<!--
var aryPType = [
[0,'货物',1],
[0,'服务',2],
[0,'投资',3],
[0,'知识产权',4],
[0,'其他',5],
[2,'商务服务',6],
[2,'通讯服务',7],
[2,'建筑和相关的工程服务',8],
[2,'分销服务',9],
[2,'教育服务',10],
[2,'环境服务',11],
[2,'金融服务',12],
[2,'与健康相关的服务和社会服务',13],
[2,'旅游和与旅游相关的服务',14],
[2,'娱乐、文化和体育服务',15],
[2,'运输服务',16],
[2,'其他地方没有包括的服务',17],
[6,'专业服务',18],
[6,'计算机及相关服务',19],
[6,'研究和开发服务',20],
[6,'房地产服务',21],
[6,'无操作人员的租赁服务（干租服务）',22],
[6,'其他商务服务',23],
[18,'法律服务',24],
[18,'会计、审计和簿记服务',25],
[18,'税收服务',26],
[18,'建筑设计服务',27],
[18,'工程服务',28],
[18,'集中工程服务',29],
[18,'城市规划和园林建筑服务',30],
[18,'医疗和牙科服务',31],
[18,'兽医服务',32],
[18,'助产士、护士、理疗医师和护理员提供的服务',33],
[18,'其他',34],
[19,'计算机硬件安装有关的咨询服务',35],
[19,'软件执行服务',36],
[19,'数据处理服务',37],
[19,'数据库服务',38],
[19,'其他',39],
[20,'自然科学的研究和开发服务',40],
[20,'社会科学和人文科学的研究和开发服务',41],
[20,'边缘学科的研究和开发服务',42],
[21,'涉及自有或租赁房地产的服务',43],
[21,'基于收费或合同的房地产服务',44],
[22,'船舶租赁',45],
[22,'航空器租赁',46],
[22,'其他运输设备租赁',47],
[22,'其他机械设备租赁',48],
[22,'其他',49],
[23,'广告服务',50],
[23,'市场调研和民意测验服务',51],
[23,'管理咨询服务',52],
[23,'与管理咨询相关的服务',53],
[23,'技术测试和分析服务',54],
[23,'与农业、狩猎、和林业有关的服务',55],
[23,'与渔业有关的服务',56],
[23,'与采矿业有关的服务',57],
[23,'与制造业有关的服务',58],
[23,'与能源分配有关的服务',59],
[23,'人员提供与安排服务',60],
[23,'调查与保安服务',61],
[23,'相关的科学和技术咨询服务',62],
[23,'设备的维修和保养服务',63],
[23,'建筑物清洁服务',64],
[23,'摄影服务',65],
[23,'包装服务',66],
[23,'印刷和出版服务',67],
[23,'会议服务',68],
[23,'其他服务',69],
[7,'邮政服务',70],
[7,'速递服务',71],
[7,'电信服务',72],
[7,'视听服务',73],
[7,'其他',74],
[72,'语音电话服务',75],
[72,'集束切换数据传输服务',76],
[72,'线路切换数据传输服务',77],
[72,'电传服务',78],
[72,'电报服务',79],
[72,'传真服务',80],
[72,'私有线路租赁服务',81],
[72,'电子邮件服务',82],
[72,'语音邮件服务',83],
[72,'在线信息和数据调用服务',84],
[72,'电子数据交换服务',85],
[72,'增值传真服务，包括储存和发送、储存和调用',86],
[72,'编码和规程服务',87],
[72,'在线信息和/或数据处理（包括传输处理）',88],
[72,'其他',89],
[73,'电影和录像的制作和发行服务',90],
[73,'电影放映服务',91],
[73,'广播和电视服务',92],
[73,'广播和电视传输服务',93],
[73,'录音服务',94],
[73,'其他',95],
[8,'建筑物的总体建筑工作',96],
[8,'民用工程的总体建筑工作',97],
[8,'安装和组装工作',98],
[8,'建筑物的装修工作',99],
[8,'其他',100],
[9,'佣金代理服务',101],
[9,'批发销售服务',102],
[9,'零售服务',103],
[9,'特许经营服务',104],
[9,'其他',105],
[10,'初级教育服务',106],
[10,'中等教育服务',107],
[10,'高等教育服务',108],
[10,'成人教育服务',109],
[10,'其他教育服务',110],
[11,'排污服务',111],
[11,'废物处理服务',112],
[11,'卫生及类似服务',113],
[11,'其他',114],
[12,'所有保险和与其相关的服务',115],
[12,'银行和其他金融服务（不含保险）',116],
[12,'其他',117],
[115,'人寿险、意外险和健康保险服务',118],
[115,'非人寿保险服务',119],
[115,'再保险和转分保服务',120],
[115,'保险辅助服务（包括保险经纪、保险代理）',121],
[116,'接受公众存款和其他需偿还的资金',122],
[116,'所有类型的贷款，包括消费信贷、抵押贷款、保理和商业交易的融资',123],
[116,'金融租赁',124],
[116,'所有支付和货币汇送服务',125],
[116,'担保与承兑',126],
[116,'货币市场票据',127],
[116,'外汇',128],
[116,'衍生产品，包括，但不限于期待和期权',129],
[116,'汇率和利率契约，包括调期和远期利、汇率协议',130],
[116,'可转让证券',131],
[116,'其他可转让的票据和金融资产，包括金银条块',132],
[116,'参与各类证券的发行',133],
[116,'货币经纪',134],
[116,'资产管理',135],
[116,'金融资产的结算和清算，包括证券、衍生产品和其他可转让票据',136],
[116,'咨询和其他辅助金融服务',137],
[116,'提供和传输其他金融服务提供者提供的金融信息、金融数据处理和相关的软件',138],
[13,'医院服务',139],
[13,'其他人类健康服务',140],
[13,'社会服务',141],
[14,'饭店和餐饮服务（包括外卖服务）',142],
[14,'旅行社和旅游经营者服务',143],
[14,'导游服务',144],
[14,'其他',145],
[15,'文娱服务（除视听服务以外）',146],
[15,'新闻社服务',147],
[15,'图书馆、档案馆、博物馆和其他文化服务',148],
[15,'体育和其他娱乐服务',149],
[15,'其他',150],
[16,'海洋运输服务',151],
[16,'内水运输服务',152],
[16,'航空运输服务',153],
[16,'航天运输服务',154],
[16,'铁路运输服务',155],
[16,'公路运输服务',156],
[16,'管道运输',157],
[16,'所有运输方式的辅助服务',158],
[16,'其他运输服务',159],
[151,'客运服务',160],
[151,'货运服务',161],
[151,'船舶和船员的租赁',162],
[151,'船舶维修和保养',163],
[151,'拖驳服务',164],
[151,'海运的支持服务',165],
[152,'客运服务',166],
[152,'货运服务',167],
[152,'船舶和船员的租赁服务',168],
[152,'船舶的维修和保养',169],
[152,'拖驳服务',170],
[152,'内水运输的支持服务',171],
[153,'客运服务',172],
[153,'货运服务',173],
[153,'带乘务员的飞机租赁服务',174],
[153,'飞机的维修和保养服务',175],
[153,'空运支持服务',176],
[155,'客运服务',177],
[155,'货运服务',178],
[155,'推车和拖车服务',179],
[155,'铁路运输设备的维修和保养服务',180],
[155,'铁路运输的的支持服务',181],
[156,'客运服务',182],
[156,'货运服务',183],
[156,'商用车辆和司机的租赁',184],
[156,'公路运输的设备的维修和保养服务',185],
[156,'公路运输打支持服务',186],
[156,'燃料传输',187],
[156,'其他货物的运输',188],
[156,'理货服务',189],
[156,'仓储服务',190],
[156,'货运代理服务',191],
[156,'其他',192],
[1,'活动物;动物产品',193],
[1,'植物产品',194],
[1,'动、植物油、脂及其分解产品;精制的食用油脂;动植物蜡',195],
[1,'食品;饮料、酒及醋；烟草、烟草及烟草代用品的制品',196],
[1,'矿产品',197],
[1,'化学工业及相关工业的产品',198],
[1,'塑料及及其制品；橡胶及其制品',199],
[1,'生皮、皮革、毛皮及制品；鞍具及挽具；旅游用品、手提包及类似容器；动物肠线（蚕胶丝除外）制品',200],
[1,'木及木制品；木炭；软木及软木制品；稻草、秸秆、针茅或其他编结材料制品；篮筐及柳条编结品',201],
[1,'木浆及其他纤维素浆；回收（废碎）纸或纸板；纸、纸板及其制品',202],
[1,'纺织原料及纺织制品',203],
[1,'鞋帽伞杖鞭及其零件；已加工的羽毛及其制品；人造花；人发制品',204],
[1,'石料、石膏、水泥、石棉、云母、及类似的制品；陶瓷产品；玻璃及其制品',205],
[1,'天然或养殖珍珠、宝石或半宝石、贵金属、宝贵金属及其制品；仿首饰；硬币',206],
[1,'贱金属及其制品',207],
[1,'机器、机械器具、电气设备机器零件；录音机及放音机、电视图象、声音的录制和重放设备及其零件、附件',208],
[1,'车辆、航空器、船舶及其有关的运输设备',209],
[1,'光学、照相、电影、计量、检验、医疗或外科用仪器及设备、精密仪器及设备；钟表；乐器；及相关零件、附件',210],
[1,'武器、弹药及其零件、附件',211],
[1,'杂项制品',212],
[1,'艺术品、收藏品及古物',213],
[193,'活动物',214],
[193,'肉及食用杂碎',215],
[193,'鱼、甲壳动物、软体动物及其他水生无脊椎动物',216],
[193,'乳品；蛋品；天然蜂蜜；其他食用动物产品',217],
[193,'其他动物产品',218],
[194,'活树及其他活植物；鳞茎、根及类似产品；插花及装饰用簇叶',219],
[194,'食用蔬菜、根及块茎',220],
[194,'食用水果及坚果；柑桔属水果或甜瓜的果皮',221],
[194,'咖啡、茶、马黛茶及调味香料',222],
[194,'谷物',223],
[194,'制粉工业产品；麦芽；淀粉；菊粉；面筋',224],
[194,'含油子仁及果实；杂项子仁及果实；工业用或药用植物；稻草、秸秆及饲料',225],
[194,'虫胶；树胶、树脂及其他植物液、汁',226],
[194,'编结用植物材料；其他植物产品',227],
[195,'动、植物油、脂及分解产品；精制的食用油脂；动、植物蜡',228],
[196,'肉、鱼、甲壳动物、软体动物及其他水生物无脊椎动物的制品',229],
[196,'糖及糖食',230],
[196,'可可及可可制品',231],
[196,'谷物、粮食粉、淀粉或乳的制品；糕饼点心',232],
[196,'蔬菜、水果、坚果或植物其他部分的制品',233],
[196,'杂项食品',234],
[196,'饮料、酒及醋',235],
[196,'食品工业的残渣及废料；配制的动物饲料',236],
[196,'烟草、烟草及烟草代用品的制品',237],
[197,'盐；硫磺；泥土及石料；石膏料、石灰及水泥',238],
[197,'矿砂、矿渣及矿灰',239],
[197,'矿物燃料、矿物油及其蒸馏产品；沥青物质；矿物蜡',240],
[198,'无机化学品；贵金属、稀土金属、放射性元素及其同位素的有机及无机化合物',241],
[198,'有机化学品',242],
[198,'药品',243],
[198,'肥料',244],
[198,'鞣料浸膏及染料浸膏；鞣酸及其衍生物；染料颜料及其他着色料；油漆及清漆；油灰及其他类似胶粘济；墨水油墨',245],
[198,'精油及香膏；芳香料制品及化妆盥洗品',246],
[198,'肥皂、有机表面活性剂、洗涤剂、润滑剂、人造蜡、调制蜡、光洁剂、蜡烛及类似产品、塑型用膏、“牙科用蜡”及牙科用熟石膏制剂',247],
[198,'蛋白类物质；改性淀粉；胶；酶',248],
[198,'炸药；烟火制品；火柴；引火合金；易燃材料制品',249],
[198,'照相及电影用品',250],
[198,'杂项化学产品',251],
[199,'塑料及其制品',252],
[199,'橡胶及其制品',253],
[200,'生皮（毛皮除外）及皮革',254],
[200,'皮革制品；鞍具及挽具；旅行用品、手提包及类似容器；动物肠线（蚕胶丝除外）制品',255],
[200,'毛皮、人造毛皮及其制品',256],
[201,'木及木制品；木炭',257],
[201,'软木及软木制品',258],
[201,'稻草、秸秆、针茅或其他编结材料制品；篮筐及柳条编结品',259],
[202,'木浆及其他纤维状纤维素浆；回收（废碎）纸或纸板',260],
[202,'纸及纸板；纸浆、纸或纸板制品',261],
[202,'书籍、报纸、印刷图画及其他印刷品；手稿、打字稿及设计图纸',262],
[203,'蚕丝',263],
[203,'羊毛、动物细毛或粗毛；马毛纱线及其机织物',264],
[203,'棉花',265],
[203,'其他植物纺织纤维；纸纱线及其织物',266],
[203,'化学纤维长丝',267],
[203,'化学纤维短纤',268],
[203,'絮胎、毡呢及无纺织物；特种纱线；线、绳、索、缆及其制品',269],
[203,'地毯及纺织材料的其他铺地制品',270],
[203,'特种机织物；簇绒织物；花边；装饰毯；装饰带；刺绣品',271],
[203,'浸渍、涂布、包覆或存压地纺织物；工业用纺织制品',272],
[203,'针织物及钩编织物',273],
[203,'针织或钩编的服装及衣着附件',274],
[203,'非针织或非钩编的服装及衣着附件',275],
[203,'其他纺织制成品；成套织物；旧衣着及旧纺织品；碎织物',276],
[204,'鞋靴、护腿和类似产品及其零件',277],
[204,'帽类及其零件',278],
[204,'雨伞、阳伞、手杖、鞭子、马鞭及其零件',279],
[204,'已加工羽毛、羽绒及其制品；人造花；人发制品',280],
[205,'石料、石膏、水泥、石棉、云母及类似材料制品',281],
[205,'陶瓷产品',282],
[205,'玻璃及其制品',283],
[206,'天然或养殖珍珠、宝石或半宝石、贵金属、宝贵金属及其制品；仿首饰；硬币',284],
[207,'钢铁',285],
[207,'钢铁制品',286],
[207,'铜及其制品',287],
[207,'镍及其制品',288],
[207,'铝及其制品',289],
[207,'（保留为税则将来所用）',290],
[207,'铅及其制品',291],
[207,'锌及其制品',292],
[207,'锡及其制品',293],
[207,'其他贱金属、金属陶瓷及其制品',294],
[207,'贱金属工具、器具、利口器、餐匙、餐叉及其零件',295],
[207,'贱金属杂项制品',296],
[208,'核反应堆、锅炉、机器、机械器具及其零件',297],
[208,'电机、电气设备及其零件；录音机及放声机、电视图象、声音的录制和重放设备及其零件、附件',298],
[209,'铁道及电车道机车、车辆及其零件；铁道及电车道轨道固定装置及其零件、附件；各种机械（包括电动机械）交通信号设备',299],
[209,'车辆及其零件、附件，但铁道及电车道车辆除外',300],
[209,'航空器、航天器及其零件',301],
[209,'船舶及浮动结构体',302],
[210,'光学、照相、电影、计量、检验、医疗或外科用仪器及设备、精密一起及设备；上述物品的零件、附件',303],
[210,'钟表及其零件',304],
[210,'乐器及其零件、附件',305],
[211,'武器、弹药及其零件、附件',306],
[212,'家具；寝具、褥垫、弹簧床垫、软座垫及类似的填充制品；未列名灯具及照明装置；发光标志、发光铭牌及类似品；活动房屋',307],
[212,'玩具、游戏品运动用品及其零件、附件',308],
[212,'杂项制品',309],
[213,'艺术收藏品及古物',310],
[3,'投资准入',311],
[3,'投资经营',312],
[3,'投资退出',313],
[4,'版权',314],
[4,'商标',315],
[4,'地理标识',316],
[4,'工业设计',317],
[4,'专利',318],
[4,'集成电路布图设计',319],
[4,'未披露信息',320]
]

window.onload = function(){
  form = document.forms[0];
 
  form.selP1.setAttribute("subElement", "selP2");
  form.selP2.setAttribute("subElement", "selP3");
  form.selP3.setAttribute("subElement", "selP4");
 
//  setupCascadeSelect(form.selP1, 0, aryPType, false);
new CascadeSelect(form.selP1, "0", aryPType);
}
-->
</script>
</head>
<body>
<form name="form1" method="post" action="">
  <select name="selP1" id="selP1" >
  </select>
  <br>
  <select name="selP2" id="selP2">
  </select>
  <br>
  <select name="selP3" id="selP3">
  </select>
  <br>
  <select name="selP4" id="selP4">
  </select>
  <br>
</form>
<div id="times"></div>
</body>
</html>