想实现四级联动,但是不知道哪里出了问题,求大神看看

舵主大大 2015-08-26 09:01:24
<SCRIPT LANGUAGE="JavaScript">

var selector = [ "xuebu", "jieshu", "Title", "banji" ];

menu =[
"小学部",

"2015届",

"小学一年级",

"2015一年级一班",

,

,

"幼儿部",

"2015届",

"幼儿园大班",

"2015大一班",

"幼儿园小班",

"2015小一班",

"幼儿园中班",

"2015中一班",

,

,

];

function wizz(level)
{
if( level == 0 )
a = menu;
else
{
str = "menu";
for( i=0; i<level; i++ )
str += "[" + (document.all[selector[i]].selectedIndex * 3 + 2) + "]";
a = eval_r(str);
}
if( a == null ) return;
s = document.all[selector[level]];
i = s.length;
while( i > 0 ) s.options[--i] = null;
while( i < Math.floor(a.length/3) )
s.options[i] = Option( a[i*3], a[i++*3+1] );
s.onchange = Function("wizz(" + (level+1) + ")");
wizz(level+1);
}
wizz(0);
</SCRIPT>
<form name="add" method="post" action="Information.asp">
<table cellpadding="0" cellspacing="0" border="0" width="500" align="center"><tr align='center' bgcolor='#FFFFFF'>
<td align='right' bgcolor="#FFFFFF"> 部门:</td>
<td align='left'>
<select name="xuebu" onchange="wizz(1)" >

</select></td>
</tr>
<tr align='center' bgcolor='#FFFFFF'>
<td align='right' bgcolor="#FFFFFF"> 届数:</td>
<td align='left'>

<select name="jieshu" onchange="wizz(2)">
</select>
</td>
</tr>
<tr align='center' bgcolor='#FFFFFF'>
<td align='right' bgcolor="#FFFFFF"> 年级:</td>
<td align='left'>

<select name="Title" onchange="wizz(3)">

</select>
</td>
</tr>
<tr align='center' bgcolor='#FFFFFF'>
<td align='right' bgcolor="#FFFFFF"> 班级:</td>
<td align='left'>

<select name="banji" >

</select>
</td>
</tr>
</table>
</form>
...全文
104 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
舵主大大 2015-08-26
  • 打赏
  • 举报
回复
问题没说清楚,但是已经解决了,具体实现如 <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <SCRIPT LANGUAGE="JavaScript"> var fourSelectData={ "请选择部门":{val:"",items:{ "请选择届数":{val:"",items:{ "请选择年级":{val:"",items:{ "请选择班级":"" }} }} }}, "小学部":{val:"小学部",items:{ "2015届":{val:"2015届",items:{ "小学一年级":{val:"小学一年级",items:{ "2015一年级一班":"2015一年级一班", }}, }} }}, "幼儿部":{val:"幼儿部",items:{ "2015届":{val:"2015届",items:{ "幼儿园大班":{val:"幼儿园大班",items:{ "2015大一班":"2015大一班", }}, "幼儿园小班":{val:"幼儿园小班",items:{ "2015小一班":"2015小一班", }}, "幼儿园中班":{val:"幼儿园中班",items:{ "2015中一班":"2015中一班", "2015中二班":"2015中二班", }}, }} }}, }; /* 通用四级联动说明 参数配置如下,配置select的四个ID和默认值就行,无默认值填写为null,v1-v4可省略 var defaults = { s1:'Select1', s2:'Select2', s3:'Select3', s4:'Select3', v1:null, v2:null, v3:null, v4:null }; */ var defaults = { s1:'xuebu', s2:'jieshu', s3:'Title', s4:'banji', v1:"请选择部门", v2:"请选择届数", v3:"请选择年级", v4:"请选择班级" }; $(function(){ fourSelect(defaults); }); function fourSelect(config){ var $s1=$("#"+config.s1); var $s2=$("#"+config.s2); var $s3=$("#"+config.s3); var $s4=$("#"+config.s4); var v1=config.v1?config.v1:null; var v2=config.v2?config.v2:null; var v3=config.v3?config.v3:null; var v4=config.v4?config.v4:null; $.each(fourSelectData,function(k,v){ appendOptionTo($s1,k,v.val,v1); }); $s1.change(function(){ $s2.html(""); if(this.selectedIndex==-1) return; var s1_curr_val = this.options[this.selectedIndex].value; $.each(fourSelectData,function(k,v){ if(s1_curr_val==v.val){ if(v.items){ $.each(v.items,function(k,v){ appendOptionTo($s2,k,v.val,v2); }); } } }); if($s2[0].options.length==0){appendOptionTo($s2,"...","",v2);} $s2.change(); }).change(); $s2.change(function(){ $s3.html(""); if(this.selectedIndex==-1) return; var s1_curr_val = $s1[0].options[$s1[0].selectedIndex].value; var s2_curr_val = this.options[this.selectedIndex].value; $.each(fourSelectData,function(k,v){ if(s1_curr_val==v.val){ if(v.items){ $.each(v.items,function(k,v){ if(s2_curr_val==v.val){ if(v.items){ $.each(v.items,function(k,v){ appendOptionTo($s3,k,v.val,v3); }); } } }); } } }); if($s3[0].options.length==0){appendOptionTo($s3,"...","",v3);} $s3.change(); }).change(); $s3.change(function(){ $s4.html(""); if(this.selectedIndex==-1) return; var s1_curr_val = $s1[0].options[$s1[0].selectedIndex].value; var s2_curr_val = $s2[0].options[$s2[0].selectedIndex].value; var s3_curr_val = this.options[this.selectedIndex].value; $.each(fourSelectData,function(k,v){ if(s1_curr_val==v.val){ if(v.items){ $.each(v.items,function(k,v){ if(s2_curr_val==v.val){ if(v.items){ $.each(v.items,function(k,v){ if(s3_curr_val==v.val){ if(v.items){ $.each(v.items,function(k,v){ appendOptionTo($s4,k,v,v4); }); } } }); } } }); } } }); if($s4[0].options.length==0){appendOptionTo($s4,"...","",v4);} }).change(); function appendOptionTo($o,k,v,d){ var $opt=$("<option>").text(k).val(v); if(v==d){$opt.attr("selected", "selected")} $opt.appendTo($o); } } </SCRIPT> <tr align='center' bgcolor='#FFFFFF'> <td align='right' bgcolor="#FFFFFF"> 部门:</td> <td align='left'> <select name="xuebu"id="xuebu" > </select></td> </tr> <tr align='center' bgcolor='#FFFFFF'> <td align='right' bgcolor="#FFFFFF"> 届数:</td> <td align='left'> <select name="jieshu" id="jieshu" > </select> </td> </tr> <tr align='center' bgcolor='#FFFFFF'> <td align='right' bgcolor="#FFFFFF"> 年级:</td> <td align='left'> <select name="Title" id="Title" > </select> </td> </tr> <tr align='center' bgcolor='#FFFFFF'> <td align='right' bgcolor="#FFFFFF"> 班级:</td> <td align='left'> <select name="banji" id="banji" > </select> </td> </tr>
舵主大大 2015-08-26
  • 打赏
  • 举报
回复
JS 这个样子 不知道级别弄错没有 <SCRIPT LANGUAGE="JavaScript"> selector = [ "xuebu", "jieshu", "Title", "banji" ]; menu =[ "小学部","小学部", [ "2015届","2015届", [ "小学一年级","小学一年级", [ "2015一年级一班","2015一年级一班", [ ], ], ], ], "幼儿部","幼儿部", [ "2015届","2015届", [ "幼儿园大班","幼儿园大班", [ "2015大一班","2015大一班", [ ], ], "幼儿园小班","幼儿园小班", [ "2015小一班","2015小一班", [ ], ], "幼儿园中班","幼儿园中班", [ "2015中一班","2015中一班", [ ], ], ], ], ]; function wizz(level) { if( level == 0 ) a = menu; else { str = "menu"; for( i=0; i<level; i++ ) str += "[" + (document.all[selector[i]].selectedIndex * 3 + 2) + "]"; a = eval_r(str); } if( a == null ) return; s = document.all[selector[level]]; i = s.length; while( i > 0 ) s.options[--i] = null; while( i < Math.floor(a.length/3) ) s.options[i] = Option( a[i*3], a[i++*3+1] ); s.onchange = Function("wizz(" + (level+1) + ")"); wizz(level+1); } wizz(0); </SCRIPT>
舵主大大 2015-08-26
  • 打赏
  • 举报
回复
menu =[ [ "小学部", "2015届", "小学一年级", "2015一年级一班", ] , [ "幼儿部", "2015届", "幼儿园大班", "2015大一班", "幼儿园小班", "2015小一班", "幼儿园中班", "2015中一班", ] , ];
DaveLeeCN 2015-08-26
  • 打赏
  • 举报
回复
这数据就是个一维数组,你怎么分级别的?为毛不用json?

87,845

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧