这般就控制了无法更改已部分工作逻辑来促成多重表单的联动

    
说实话这地点的稿子在网上广大,但是自己下载了几个看了刹那间代码,发现都是来自一个人的真迹,而且非凡联动很不好用,所以啊我就依照自己的想法再一次写了一晃这东西,分享给我们!欢迎转载但请阐明出处Email:See7di@Gmail.com,Seven的部落格http://hi.baidu.com/see7di/home

js实现多元联动的主意很多,那里给出⼀种5级联动的例证,其实可以扩充成N级联动,在做项目标时候碰到了这样⼀个问题而是有不可能从数据库中动态的加载这么些采纳,所以只有想方法从单个的页面先导来处理了,应为项目标表单是动态暴发的,所以需要各样流程的规划过程中需要有独立的页面来拍卖,这样就决定了不可能改变已有的事情逻辑来落实多元表单的联动。
Code如下:
<html>
<head>
<title>级联</title>
<meta http-equiv=”Content-Type” content=”text/html;
charset=gb2312″>
<style>
body,select
{
font-size:9pt;
font-family:Verdana;
}
a
{
color:red;
text-decoration:none;
}
a:hover
{
text-decoration:underline;
}
</style>
<SCRIPT LANGUAGE=”JavaScript”>
function Dsy()
{
this.Items = {};
}
Dsy.prototype.add = function(id,iArray)
{
this.Items[id] = iArray;
}
Dsy.prototype.Exists = function(id)
{
if(typeof(this.Items[id]) == “undefined”)
return false;
return true;
}
function change(v)
{
var str=”0″;
for(i=0;i<v;i++)
{
str+=(“_”+(document.getElementById(s[i]).selectedIndex-1));
};
var ss=document.getElementById(s[v]);
with(ss)
{
length = 0;
options[0]=new Option(opt0[v],opt0[v]);
if(v && document.getElementById(s[v-1]).selectedIndex>0 || !v)
{
if(dsy.Exists(str))
{
ar = dsy.Items[str];
for(i=0;i<ar.length;i++)options[length]=new
Option(ar[i],ar[i]);
if(v)options[1].selected = true;
}
}
if(++v<s.length)
{
change(v);
}
}
}
var dsy = new Dsy();
dsy.add(“0”,[“投诉申告”,”业务咨询”,”用户预约”,”服务调度”,”另外”]);
dsy.add(“0_0”,[“标准化产品”,”行业产品”,”服务类产品”,”客户服务”]);
dsy.add(“0_0_0”,[“语音类”,”接入类”,”短信类”,”其它”]);
dsy.add(“0_0_0_0”,[“短号集群网”,”公司VPMN”,”移动总机”,”公司总机”,”公司彩铃”,”V网伴侣”]);
dsy.add(“0_0_0_0_0”,[“否认办理”,”拨打空号”,”二次认同短信问题”,”短信查询短号信息问
题”,”BOSS系统故障”,”另外”]);
dsy.add(“0_0_0_0_1”,[“否认办理”,”另外”]);
dsy.add(“0_0_0_0_2”,[“拨打空号”,”BOSS系统故障”,”拨打指示【关机】”]);
dsy.add(“0_0_0_0_3”,[“其它”]);
dsy.add(“0_0_0_0_4”,[“否认办理”,”整个公司铃音丢失”,”系统故障”,”资费误收”,”无法听到集团彩
铃”,”BOSS系统故障”,”铃音设置”,”其余”]);
dsy.add(“0_0_0_0_5”,[“否认办理”,”其余”]);
dsy.add(“0_0_0_1”,[“GPRS集团对接”,”手机邮箱(pushmail)”,”布莱克berry”,”IP专线”]);
dsy.add(“0_0_0_1_0”,[“资费误收”,”终端不可以接受”,”BOSS系统故障”,”另外”]);
dsy.add(“0_0_0_1_1”,[“套餐”,”终端不能够接收”,”BOSS系统故障”,”另外”]);
dsy.add(“0_0_0_1_2”,[“套餐”,”终端无法吸纳”,”BOSS系统故障”,”此外”]);
dsy.add(“0_0_0_1_3”,[“数据专线”,”语音专线”]);
dsy.add(“0_0_0_2”,[“企信通”,”短信直连(MAS)”,”3M”]);
dsy.add(“0_0_0_2_0”,[“无法发送短信”,”终端不可以接收”,”BOSS系统故障”,”资费误收”,”无法登
陆”,”其它”]);
dsy.add(“0_0_0_2_1”,[“不能发送短信”,”终端不能收到”,”BOSS系统故障”,”资费误收”,”不能登
陆”,”其它”]);
dsy.add(“0_0_0_2_2”,[“无法发送短信”,”终端无法吸收”,”资费误收”,”不可能登陆”,”此外”]);
dsy.add(“0_0_0_3”,[“移动字典”,”公司邮箱”,”其余”]);
dsy.add(“0_0_0_3_0”,[“无法登陆”,”其余”]);
dsy.add(“0_0_1”,[“校讯通”,”财讯通”,”警务通”,”银信通”,”城管通”,”政务通”,”物流通”,”其它”]);
dsy.add(“0_0_1_0”,[“否认办理”,”资费误收”,”终端延时(或不可以)接收”,”其余”]);
dsy.add(“0_0_1_1”,[“否认办理”,”资费误收”,”终端延时(或无法)接收”,”此外”]);
dsy.add(“0_0_1_2”,[“终端延时(或无法)接收”,”另外”]);
dsy.add(“0_0_1_3”,[“否认办理”,”资费误收”,”终端延时(或不可能)接收”,”其余”]);
dsy.add(“0_0_1_4”,[“否认办理”,”资费误收”,”终端延时(或不可以)接收”,”另外”]);
dsy.add(“0_0_1_5”,[“否认办理”,”资费误收”,”终端延时(或不能够)接收”,”此外”]);
dsy.add(“0_0_1_6”,[“否认办理”,”资费误收”,”终端延时(或无法)接收”,”另外”]);
dsy.add(“0_0_1_7”,[“其它”]);
dsy.add(“0_0_2”,[“跨市VPMN”,”跨市短号集群网”,”公司代付”]);
dsy.add(“0_0_2_0”,[“互联互通”,”资费误收”,”此外”]);
dsy.add(“0_0_2_1”,[“互联互通”,”资费误收”,”另外”]);
dsy.add(“0_0_2_2”,[“互联互通”,”资费误收”,”另外”]);
dsy.add(“0_0_3”,[“客户总经理”,”服务厅”,”分销商”,”产品开发商”]);
dsy.add(“0_0_3_0”,[“服务态度”,”业务受理延时”,”业务受理错误”,”联系无应答”]);
dsy.add(“0_0_3_1”,[“服务态度”,”业务受理延时”,”业务受理错误”,”联系无应答”]);
dsy.add(“0_0_3_2”,[“服务态度”,”业务受理延时”,”业务受理错误”,”联系无应答”]);
dsy.add(“0_0_3_3”,[“服务态度”,”业务受理延时”,”业务受理错误”,”联系无应答”]);
dsy.add(“0_1”,[“标准化产品”,”行业产品”,”服务类产品”]);
dsy.add(“0_1_0”,[“短号集群网”,”移动总机”,”公司总机”,”公司彩铃”,”V网伴侣”,”GPRS公司对接”,”手
机邮箱(pushmail)”,”布莱克(Black)berry”,”IP专线”,”企信通”,”短信直连(MAS)”,”公司邮箱”,”移动字
典”]);
dsy.add(“0_1_0_0”,[“业务办理原则及流程”,”产品使用功效”,”资费计费介绍”,”系统操作指导”,”营销
方案”]);
dsy.add(“0_1_0_1”,[“业务办理条件及流程”,”产品拔取效果”,”资费计费介绍”,”系统操作指点”,”营销
方案”]);
dsy.add(“0_1_0_2”,[“业务办理条件及流程”,”产品采纳效果”,”资费计费介绍”,”系统操作指引”,”营销
方案”]);
dsy.add(“0_1_0_3”,[“业务办理条件及流程”,”产品拔取效益”,”资费计费介绍”,”系统操作携带”,”营销
方案”]);
dsy.add(“0_1_0_4”,[“业务办理原则及流程”,”产品采用效用”,”资费计费介绍”,”系统操作带领”,”营销
方案”]);
dsy.add(“0_1_0_5”,[“业务办理原则及流程”,”产品使用效用”,”资费计费介绍”,”系统操作引导”,”营销
方案”]);
dsy.add(“0_1_0_6”,[“业务办理条件及流程”,”产品应用功效”,”资费计费介绍”,”系统操作引导”,”营销
方案”]);
dsy.add(“0_1_0_7”,[“业务办理原则及流程”,”产品应用功用”,”资费计费介绍”,”系统操作带领”,”营销
方案”]);
dsy.add(“0_1_0_8”,[“业务办理原则及流程”,”产品选取效果”,”资费计费介绍”,”系统操作指引”,”营销
方案”]);
dsy.add(“0_1_0_9”,[“业务办理条件及流程”,”产品选取效益”,”资费计费介绍”,”系统操作指点”,”营销
方案”]);
dsy.add(“0_1_0_10”,[“业务办理条件及流程”,”产品拔取效益”,”资费计费介绍”,”系统操作指导”,”营销
方案”]);
dsy.add(“0_1_0_11”,[“业务办理原则及流程”,”产品使用效能”,”资费计费介绍”,”系统操作指引”,”营销
方案”]);
dsy.add(“0_1_0_12”,[“业务办理条件及流程”,”产品应用功效”,”资费计费介绍”,”系统操作指点”,”营销
方案”]);
dsy.add(“0_1_1”,[“校讯通”,”财讯通”,”警务通”,”银信通”,”城管通”,”政务通”,”物流通”,”其它”]);
dsy.add(“0_1_1_0”,[“业务办理原则及流程”,”产品应用效果”,”资费计费介绍”,”系统操作指点”,”营销
方案”]);
dsy.add(“0_1_1_1”,[“业务办理原则及流程”,”产品选用效果”,”资费计费介绍”,”系统操作指导”,”营销
方案”]);
dsy.add(“0_1_1_2”,[“业务办理条件及流程”,”产品选取效益”,”资费计费介绍”,”系统操作指点”,”营销
方案”]);
dsy.add(“0_1_1_3”,[“业务办理条件及流程”,”产品选取效益”,”资费计费介绍”,”系统操作指引”,”营销
方案”]);
dsy.add(“0_1_1_4”,[“业务办理条件及流程”,”产品使用效能”,”资费计费介绍”,”系统操作指导”,”营销
方案”]);
dsy.add(“0_1_1_5”,[“业务办理条件及流程”,”产品应用效用”,”资费计费介绍”,”系统操作率领”,”营销
方案”]);
dsy.add(“0_1_1_6”,[“业务办理原则及流程”,”产品选用效果”,”资费计费介绍”,”系统操作指引”,”营销
方案”]);
dsy.add(“0_1_1_7”,[“其它”]);
dsy.add(“0_1_2”,[“跨市VPMN”,”跨市短号集群网”,”公司代付”]);
dsy.add(“0_1_2_0”,[“业务办理原则及流程”,”产品应用功能”,”资费计费介绍”,”系统操作指点”,”营销
方案”]);
dsy.add(“0_1_2_1”,[“业务办理原则及流程”,”产品采用效益”,”资费计费介绍”,”系统操作指导”,”营销
方案”]);
dsy.add(“0_1_2_2”,[“业务办理原则及流程”,”产品使用效能”,”资费计费介绍”,”系统操作携带”,”营销
方案”]);
dsy.add(“0_2”,[“产品申请”,”此外”]);
dsy.add(“0_2_0”,[“新建短号集群网”,”新建公司彩铃”,”新建手机邮箱”,”新建移动总机”,”新建集团总
机”,”新建布莱克berry”,”新建IP专线”,”新建短信直连”,”新建企信通”,”其余”]);
dsy.add(“0_2_1”,[“其它”]);
dsy.add(“0_3”,[“上门(驻点)服务”,”电话服务”,”其它”]);
dsy.add(“0_3_0”,[“客户首席执行官”,”企信通开发商”,”移动总机开发商”,”移动名片开发商”,”布莱克(Black)berry开发
商”,”手机邮箱开发商”,”校讯通合作商”,”财信通合作商”,”物流通合作商”,”另外”]);
dsy.add(“0_3_1”,[“客户首席营业官”,”企信通开发商”,”移动总机开发商”,”移动名片开发商”,”布莱克(Black)berry开发
商”,”手机邮箱开发商”,”校讯通合作商”,”财信通合作商”,”物流通合作商”,”此外”]);
</SCRIPT>
<SCRIPT language = “javascript”>
var s=[“s1″,”s2″,”s3″,”s4″,”s5”];
var opt0 = [“⼀级采用”,”二级选拔”,”三级选拔”,”四级选用”,”五级接纳”];
function setup()
{
for(i=0;i<s.length-1;i++)
document.getElementById(s[i]).onchange=new
Function(“change(“+(i+1)+”)”);
change(0);
}
</SCRIPT>
</head>
<body bgcolor=”#E0E0E0″ onLoad=”setup()” style=”margin:0″>
<form name=”frm”>
<select
id=”s1″><option>⼀级选择</option></select>
<select
id=”s2″><option>二级选取</option></select>
<select
id=”s3″><option>三级采纳</option></select>
<select
id=”s4″><option>四级选拔</option></select>
<select
id=”s5″><option>五级选取</option></select>
</form>
</body>
</html>

var a_t = new
cn();

<!DOCTYPE html PUBLIC
“-//W3C//DTD XHTML 1.0 Transitional//EN”
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html
xmlns=”http://www.w3.org/1999/xhtml"&gt;
<head>
<title>国家、省、市三级联动</title>
<meta
http-equiv=”Content-Type” content=”text/html;
charset=utf-8″>
<SCRIPT
LANGUAGE=”JavaScript”>
<!–
function cn(){
    this.Items =
{};
}
cn.prototype.add =
function(id,iArray){
    this.Items[id] =
iArray;
}
cn.prototype.Exi =
function(id){
  
 if(typeof(this.Items[id]) == “undefined”){return false;}
    return true;
}

a_t.add(“0_2”,[“基隆”,”台北”,”桃园”,”新竹”,”苗栗”,”台中”,”彰化”,”南投”,”云林”,”嘉义”,”台南”,”高雄”,”台东”,”花莲”]);
a_t.add(“0_2_0”,[“基隆”]);
a_t.add(“0_2_1”,[“台北”]);
a_t.add(“0_2_2”,[“中壢市”,”平鎮市”,”龍潭鄉”,”楊梅鎮”,”新屋鄉”,”觀音鄉”,”龜山鄉”,”八德市”,”大溪鎮”,”復興鄉”,”大園鄉”,”蘆竹鄉”]);
a_t.add(“0_2_3”,[“南宁市
“]);
a_t.add(“0_2_4”,[“札幌市”]);
a_t.add(“0_2_5”,[“神戸市”]);
a_t.add(“0_2_6”,[“京都市”]);
a_t.add(“0_2_7”,[“福冈市”]);
a_t.add(“0_2_8”,[“川崎市”]);
a_t.add(“0_2_9”,[“埼玉市”]);
a_t.add(“0_2_10”,[“广岛市”]);
a_t.add(“0_2_11”,[“仙台市”]);
a_t.add(“0_2_12”,[“北九州市
“]);
a_t.add(“0_2_13”,[“千叶市”]);

function
setup(){
  
 for(i=1;i<=3;i++){
      
 document.getElementById(s[(i-1)]).onchange=new
Function(“chg(“+(i)+”)”);
    }
    chg(0);
}

a_t.add(“0”,[“中国”,”韩国”,”台湾”]);

a_t.add(“0_1”,[“首尔特別市”,”仁川广域市”,”蔚山广域市”,”济州道”]);
a_t.add(“0_1_0”,[“汉城”]);
a_t.add(“0_1_1”,[“釜山”,”机张郡”]);
a_t.add(“0_1_2”,[“大邱”,”达城郡”]);
a_t.add(“0_1_3”,[“仁川”,”江华郡”,”瓮津郡”]);
a_t.add(“0_1_4”,[“光州”]);
a_t.add(“0_1_5”,[“大田”]);
a_t.add(“0_1_6”,[“蔚山”,”蔚州郡”]);
a_t.add(“0_1_7”,[“水原市”,”城南市”,”安山市”,”高阳市”,”安养市”,”富川市”]);
a_t.add(“0_1_8”,[“春川市”,”原州市”,”江陵市”]);
a_t.add(“0_1_9”,[“清州市”]);
a_t.add(“0_1_10”,[“天安市”]);
a_t.add(“0_1_11”,[“全州市”,”群山市”,”益山市”]);
a_t.add(“0_1_12”,[“木浦市”,”丽水市”,”顺天市”]);
a_t.add(“0_1_13”,[“浦项市”,”龟尾市”,”庆州市”]);
a_t.add(“0_1_14”,[“昌原市”,”马山市”,”晋州市”]);
a_t.add(“0_1_15”,[“济州市”,”西归浦市”,”北济州郡”,”南济州郡”]);

var
s=[“tid1″,”tid2″,”tid3”];
var
o=[“台湾”,”桃园”,”八德市”];//迎欢转载但请阐明出处Email:See7di@Gmail.com,Seven的部落格http://hi.baidu.com/see7di/home

    <input
type=’submit’ value=’submit’>
</form>

//–>
</SCRIPT>
</head>
<body
onLoad=”setup()”>
<form method=’post’
action=’@.php’>
    <select id=”tid1″
name=”tid1″></select>
    <select id=”tid2″
name=”tid2″></select>
    <select id=”tid3″
name=”tid3″></select>

function chg(v){
  
 if(v==3){return;}
    var str=”0″;
  
 for(i=0;i<v;i++){str+=(“_”+(document.getElementById(s[i]).selectedIndex))};

a_t.add(“0_0”,[“安徽”,”北京”,”福建”,”甘肃”,”广东”,”广西”,”贵州”,”海南”,”河北”,”河南”,”黑龙江”,”湖北”,”湖南”,”吉林”,”江苏”,”江西”,”辽宁”,”内蒙古”,”宁夏”,”青海”,”山东”,”山西”]);
a_t.add(“0_0_0”,[“安庆”,”蚌埠”,”巢湖”,”池州”,”滁州”,”阜阳”,”合肥”,”淮北”,”淮南”,”黄山”,”六安”,”马鞍山”,”宿州”,”铜陵”,”芜湖”,”宣城”,”亳州”]);
a_t.add(“0_0_1”,[“北京”]);
a_t.add(“0_0_2”,[“福州”,”龙岩”,”南平”,”宁德”,”莆田”,”泉州”,”三明”,”厦门”,”漳州”]);
a_t.add(“0_0_3”,[“白银”,”晋城”,”定西市”,”铁岭”,”吐鲁番”,”张掖”,”温州”,”临夏乌孜本田族自治州”,”河池”,”定西”,”铜川”,”百色”,”自贡”,”资阳”]);
a_t.add(“0_0_4”,[“潮州”,”东莞”,”佛山”,”广州”,”河源”,”深圳”,”阳江”,”云浮”,”湛江”,”肇庆”,”中山”,”珠海”]);
a_t.add(“0_0_5”,[“百色”,”北海”,”崇左”,”防城港”,”桂林”,”贵港”,”河池”,”贺州”,”来宾”,”柳州”,”南宁”,”钦州”,”梧州”,”玉林”]);
a_t.add(“0_0_6”,[“大同”,”丹东”,”哈尔滨”,”辽阳”,”六盘水市”,”黔南撒拉族土族自治州”,”黔西南水族锡伯族自治州”,”衡水”,”荆州”]);
a_t.add(“0_0_7”,[“澄迈县”,”定安县”,”东方”,”阜阳”,,”琼中达斡尔族维吾尔族自治县”,”大庆”,”屯昌县”,”万宁”,”文昌”,”五指山”,”延安”]);
a_t.add(“0_0_8”,[“保定”,”沧州”,”承德”,”邯郸”,”衡水”,”廊坊”,”秦皇岛”,”石家庄”,”唐山”,”邢台”,”张家口”]);
a_t.add(“0_0_9”,[“安阳”,”鹤壁”,”济源”,”焦作”,”开封”,”洛阳”,”南阳”,”平顶山”,”三门峡”,”商丘”,”新乡”,”信阳”,”许昌”,”郑州”,”周口”,”驻马店”,”漯河”,”濮阳”]);
a_t.add(“0_0_10”,[“连云港”,”大兴安岭”,”墨西卡利”,”固原”,”哈密”,”巴中”,”安庆”,”湘江”,”固原”,”玉溪(哈尔)”,”贵港”,”鹤岗”,”河池”]);
a_t.add(“0_0_11”,[“晋城”,”恩施水族侗族自治州”,”湘潭”,”临汾”,”淮北”,”潮州”,”潜江”,”神农架林区”,”大同”,”普洱”,”天门”,”夏洛特(Charlotte)”,”仙桃”,”舟山”,”襄樊”,”黄石”,”常德”]);
a_t.add(“0_0_12”,[“南阳”,”罗利(Raleign)”,”马鞍山”,”秦皇岛”,”北部湾”,”德州”,”梅州”,”潮州”,”湘西赫哲族苗族自治州”,”梅州”,”抚顺”,”连云港”,”海东”,”漳州”]);
a_t.add(“0_0_13”,[“日喀则”,”日喀则”,”俄克拉荷马城”,”广东”,”葫芦岛”,”伊春”,”淮南”,”怀化”,”延边布朗族自治州”]);
a_t.add(“0_0_14”,[“常州”,”淮安”,”连云港”,”南京”,”南通”,”苏州”,”宿迁”,”泰州”,”无锡”,”徐州”,”盐城”,”扬州”,”镇江”]);
a_t.add(“0_0_15”,[“抚州”,”赣州”,”吉安”,”景德镇”,”九江”,”南昌”,”萍乡”,”上饶”,”新余”,”宜春”,”鹰潭”]);
a_t.add(“0_0_16”,[“鞍山”,”本溪”,”朝阳”,”大连”,”丹东”,”抚顺”,”阜新”,”葫芦岛”,”锦州”,”辽阳”,”盘锦”,”沈阳”,”铁岭”,”营口”]);
a_t.add(“0_0_17”,[“六盘水”,”巴彦淖尔盟”,”滁州”,”玉林”,”永州”,”揭阳”,”宿州”,”玉溪”,”鄂州”,”双鸭山盟”,”鹤壁”,”荆门”]);
a_t.add(“0_0_18”,[“固原”,”石嘴山”,”吴忠”,”银川”]);
a_t.add(“0_0_19”,[“果洛拉祜族自治州”,”海南锡伯族自治州”,”固原”,”果洛普米族自治州”,”海西满族哈尼族自治州”,”海东地区”,”常德”,”玉树汉族自治州”]);
a_t.add(“0_0_20”,[“滨州”,”德州”,”东营”,”菏泽”,”济南”,”济宁”,”莱芜”,”聊城”,”临沂”,”青岛”,”日照”,”泰安”,”威海”,”潍坊”,”烟台”,”枣庄”,”淄博”]);

    var
ss=document.getElementById(s[v]);
    with(ss){
        length = 0;  
 //清理掉option
      
 if(a_t.Exi(str)){
          
 ar=a_t.Items[str];
          
 for(i=0;i<ar.length;i++){
              
 options[length]=new Option(ar[i],ar[i]);
              
 if(ar[i]==o[v]){options[i].selected=true;}//若是列表内涵盖最先项目则默认选中
            }
        }
      
 if(++v<s.length){chg(v);}
    }
}