100分求select三联级动态下拉代码
求一个select三联级动态下拉代码，比省，市，区，它们都在一张表里,比如:
ID 名称 上级ID
1 江苏 0
2 南京 1
3 玄武区 2
[解决办法]
sf
[解决办法]
SF,建议使用AJAX吧。
[解决办法]
这个没什么,纯粹的写onclick事件，根据此次点击的id获得所有子女并填入下一个框
[解决办法]
这个不用Ajax也能做,只不过麻烦一下.用iframe就可以实现.我在实际开发中已经用过了.
[解决办法]
期待又人解决
[解决办法]
楼主邮箱打出来
我直接发给你
[解决办法]
用ajax dwr简单得很，给你个网址http://www.java114.com/content82/content3501.html
按上面的步骤配置，就是把后台方法暴露给页面，在js调用就行了。
[解决办法]
很需要这样的省市多级联动代码，fslx2008@163.com,谢谢赠送~
[解决办法]
http://download.csdn.net/source/241010
[解决办法]
建议做成数据库存储动态联动的，省的以后修改麻烦！
[解决办法]
up
[解决办法]
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language= "Javascript ">
/*****************************************************************************/
//联动下拉框的实现
//fnSetSubItem_Combo的参数分别为：
//objCombo：父项ID
//objSubCombo：子项ID
//arrSubItems：子项数组
//strDefValu：子项默认选项的value值
/*****************************************************************************/
function fnSetSubItem_Combo(objCombo,objSubCombo,arrSubItems,strDefValue){
var i;
var bFound;
fnClearCombo(objSubCombo);
bFound=false;
for(i=0;i <arrSubItems.length;i++){
if(arrSubItems[i][1] + " " == objCombo.value + " "){
var oOption = document.createElement( "OPTION ");
objSubCombo.options.add(oOption);
oOption.text = arrSubItems[i][2];
oOption.value = arrSubItems[i][0];
if(strDefValue + " " == oOption.value + " "){
oOption.selected=true;
}
bFound=true;
}
}
if(!bFound && objSubCombo.options.length == 0)
objSubCombo.disabled=true;
else
objSubCombo.disabled=false;
//alert(objSubCombo.onchange());
if(objSubCombo.onchange)
objSubCombo.onchange();
}
function fnClearCombo(objCombo){
var i,intLen;
//objCombo.selectedIndex=-1;
if(objCombo.Proced ==1){
intLen=objCombo.options.length;
for(i=0;i <intLen-objCombo.FirstIdx;i++){
objCombo.options[objCombo.FirstIdx]=null;
//objCombo.options.remove(0);
}
}
else{
objCombo.FirstIdx=objCombo.options.length;
objCombo.Proced =1;
}
}
function fnSetCityProv(objParObj,objSubObj,arrCPC){
objSubObj.options.length=0;
//取得当前选中的ID,递归取得所有子ID
for(i=0;i <arrCPC.length;i++){
if(arrCPC[i][0] == objParObj.value){
objSubObj.options[objSubObj.options.length]=new Option(arrCPC[i][2],arrCPC[i][0]);
}
}
fnGetCPCSubItems(objParObj,objSubObj,arrCPC,objParObj.value,0);
}
//先根
function fnGetCPCSubItems(objParObj,objSubObj,arrCPC,intParID,intLV){
var i;
var strCaption;
for(i=0;i <arrCPC.length;i++){
if(arrCPC[i][1] == intParID){
switch(intLV){
case 0:strCaption= " -- " + arrCPC[i][2];break;
case 1:strCaption= " -- " +arrCPC[i][2];break;
}
objSubObj.options[objSubObj.options.length]=new Option(strCaption,arrCPC[i][0]);
if(intLV <= 1)
fnGetCPCSubItems(objParObj,objSubObj,arrCPC,arrCPC[i][0],intLV+1)
}
}
}
</script>
<script language= "Javascript ">
//生成数组函数
function fnCreateArray(intHeight,intWidth){
var i,arrRet;
arrRet=new Array(intHeight);//生成数组的第一维
for(i=0;i <intHeight;i++){
arrRet[i] = new Array(intWidth);//生成数组的第二维
}
return arrRet;//返回生成的数组
}
//生成数组并赋值
/****第二层数组：Array-SecondLevel（数组）******/
var arrSecondLevel;
arrSecondLevel=fnCreateArray(9,3);
arrSecondLevel[0][0]= "0101 ";//value
arrSecondLevel[0][1]= "01 ";//父项value
arrSecondLevel[0][2]= "彩电 ";//text
arrSecondLevel[1][0]= "0102 ";
arrSecondLevel[1][1]= "01 ";
arrSecondLevel[1][2]= "冰箱 ";
arrSecondLevel[2][0]= "0103 ";
arrSecondLevel[2][1]= "01 ";
arrSecondLevel[2][2]= "音响 ";
arrSecondLevel[3][0]= "0201 ";
arrSecondLevel[3][1]= "02 ";
arrSecondLevel[3][2]= "内存 ";
arrSecondLevel[4][0]= "0202 ";
arrSecondLevel[4][1]= "02 ";
arrSecondLevel[4][2]= "处理器 ";
arrSecondLevel[5][0]= "0203 ";
arrSecondLevel[5][1]= "02 ";
arrSecondLevel[5][2]= "显示器 ";
arrSecondLevel[6][0]= "0204 ";
arrSecondLevel[6][1]= "02 ";
arrSecondLevel[6][2]= "鼠标 ";
arrSecondLevel[7][0]= "0301 ";
arrSecondLevel[7][1]= "03 ";
arrSecondLevel[7][2]= "书柜 ";
arrSecondLevel[8][0]= "0302 ";
arrSecondLevel[8][1]= "03 ";
arrSecondLevel[8][2]= "椅子 ";
/****第三层数组：Array-ThirdLevel（数组）******/
var arrThirdLevel;
arrThirdLevel=fnCreateArray(13,3);
arrThirdLevel[0][0]= "010101 ";//value
arrThirdLevel[0][1]= "0101 ";//父项value
arrThirdLevel[0][2]= "长虹 ";//text
arrThirdLevel[1][0]= "010102 ";
arrThirdLevel[1][1]= "0101 ";
arrThirdLevel[1][2]= "TCL ";
arrThirdLevel[2][0]= "010103 ";
arrThirdLevel[2][1]= "0101 ";
arrThirdLevel[2][2]= "创维 ";
arrThirdLevel[3][0]= "010201 ";
arrThirdLevel[3][1]= "0102 ";
arrThirdLevel[3][2]= "容星 ";
arrThirdLevel[4][0]= "010202 ";
arrThirdLevel[4][1]= "0102 ";
arrThirdLevel[4][2]= "海尔 ";
arrThirdLevel[5][0]= "010301 ";
arrThirdLevel[5][1]= "0103 ";
arrThirdLevel[5][2]= "创新 ";
arrThirdLevel[6][0]= "010302 ";
arrThirdLevel[6][1]= "0103 ";
arrThirdLevel[6][2]= "牙兰 ";
arrThirdLevel[7][0]= "020101 ";
arrThirdLevel[7][1]= "0201 ";
arrThirdLevel[7][2]= "金士顿 ";
arrThirdLevel[8][0]= "020102 ";
arrThirdLevel[8][1]= "0201 ";
arrThirdLevel[8][2]= "黑金刚 ";
arrThirdLevel[9][0]= "020201 ";
arrThirdLevel[9][1]= "0202 ";
arrThirdLevel[9][2]= "Intel ";
arrThirdLevel[10][0]= "020202 ";
arrThirdLevel[10][1]= "0202 ";
arrThirdLevel[10][2]= "AMD ";
arrThirdLevel[11][0]= "020301 ";
arrThirdLevel[11][1]= "0203 ";
arrThirdLevel[11][2]= "三星 ";
arrThirdLevel[12][0]= "020302 ";
arrThirdLevel[12][1]= "0203 ";
arrThirdLevel[12][2]= "索尼 ";
/**************初始化联动下拉框*****************/
function fnStart(){
fnSetSubItem_Combo(document.form1.firstLevel,document.form1.secondLevel,arrSecondLevel, "0101 ");//第二层
fnSetSubItem_Combo(document.form1.secondLevel,document.form1.thirdLevel,arrThirdLevel, "010101 ");//第三层
//参数依次为：父项，子项，子项数组，子项默认值
/*--三级联动初始化，分两次调用--*/
}
window.onload=fnStart;//页面载入时调用联动下拉框初始化函数
//-->
</script>
</HEAD>
<BODY>
<form name= "form1 " style= "font-size:12px; ">
商品：
<select name= "firstLevel " onChange= "fnSetSubItem_Combo(this,secondLevel,arrSecondLevel) ">
<option value= "01 " selected> 家电 </option>
<option value= "02 "> 电脑配件 </option>
<option value= "03 "> 家居 </option>
</select>
<select name= "secondLevel " onChange= "fnSetSubItem_Combo(this,thirdLevel,arrThirdLevel) " style= "width:150px; "> </select>
<select name= "thirdLevel "> </select>
</BODY>
</HTML>
[解决办法]
楼上的挺好 我用了 不过动态数据会麻烦点
[解决办法]
我这有个静态的:
<%@ page contentType= "text/html; charset=gb2312 " language= "java "
import= "java.util.* " errorPage= " "%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> 三级级联菜单 </title>
</head>
<body>
<center>
<h1>
三级级联菜单
</h1>
</center>
<div align= "center ">
<form name= "isc ">
<table border= "0 " cellspacing= "0 " cellpadding= "0 ">
<tr align= "center ">
<td nowrap height= "11 ">
国家：
<select name= "example " size= "1 "
onChange= "redirect(this.options.selectedIndex) ">
<option selected>
中国
</option>
<option>
美国
</option>
<option>
日本
</option>
<option>
韩国
</option>
</select>
省份：
<select name= "stage2 " size= "1 "
onChange= "redirect1(this.options.selectedIndex) ">
<option value= " " selected>
辽宁省
</option>
<option value= " ">
四川省
</option>
<option value= " ">
吉林省
</option>
<option value= " ">
广东省
</option>
</select>
市区：
<select name= "stage3 " size= "1 "
onChange= " ">
<option value= " " selected>
沈阳市
</option>
<option value= " ">
大连市
</option>
<option value= " ">
抚顺市
</option>
<option value= " ">
铁岭市
</option>
</select>
</table>
</form>
</div>
<script language= "JavaScript ">
<!--
var groups=document.isc.example.options.length
var group=new Array(groups)
for (i=0; i <groups; i++)
group[i]=new Array()
file://以下是中国的第二选项
group[0][0]=new Option( "辽宁省 ");
group[0][1]=new Option( "四川省 ");
group[0][2]=new Option( "吉林省 ");
group[0][3]=new Option( "广东省 ");
file://以下是美国的第二选项
group[1][0]=new Option( "纽约州 ");
group[1][1]=new Option( "加利福尼亚州 ");
group[1][2]=new Option( "华盛顿州 ");
group[1][3]=new Option( "阿拉斯加州 ");
file://以下是日本的第二选项
group[2][0]=new Option( "东京县 ");
group[2][1]=new Option( "神奈川县 ");
group[2][2]=new Option( "九州县 ");
group[2][3]=new Option( "大阪县 ");
file://以下是韩国的第二选项
group[3][0]=new Option( "韩国A ");
group[3][1]=new Option( "韩国B ");
group[3][2]=new Option( "韩国C ");
group[3][3]=new Option( "韩国D ");
var temp=document.isc.stage2
function redirect(x){
for (m=temp.options.length-1;m> 0;m--)
temp.options[m]=null
for (i=0;i <group[x].length;i++){
temp.options[i]=new Option(group[x][i].text,group[x][i].value)
}
temp.options[0].selected=true
redirect1(0)
}
var secondGroups=document.isc.stage2.options.length
var secondGroup=new Array(groups)
for (i=0; i <groups; i++) {
secondGroup[i]=new Array(group[i].length)
for (j=0; j <group[i].length; j++) {
secondGroup[i][j]=new Array() }}
file://以下是中国的第三选项
secondGroup[0][0][0]=new Option( "沈阳市 ");
secondGroup[0][0][1]=new Option( "大连市 ");
secondGroup[0][0][2]=new Option( "抚顺市 ");
secondGroup[0][0][3]=new Option( "铁岭市 ");
secondGroup[0][1][0]=new Option( "成都市 ");
secondGroup[0][1][1]=new Option( "宜宾市 ");
secondGroup[0][1][2]=new Option( "南充市 ");
secondGroup[0][1][3]=new Option( "泸州市 ");
secondGroup[0][2][0]=new Option( "延边市 ");
secondGroup[0][2][1]=new Option( "白城市 ");
secondGroup[0][2][2]=new Option( "白山市 ");
secondGroup[0][2][3]=new Option( "黑山市 ");
secondGroup[0][3][0]=new Option( "深圳市 ");
secondGroup[0][3][1]=new Option( "广州市 ");
secondGroup[0][3][2]=new Option( "佛山市 ");
secondGroup[0][3][3]=new Option( "珠海市 ");
file://以下是美国的第三选项
secondGroup[1][0][0]=new Option( "纽约市1 ");
secondGroup[1][0][1]=new Option( "纽约市2 ");
secondGroup[1][0][2]=new Option( "纽约市3 ");
secondGroup[1][0][3]=new Option( "纽约市4 ");
secondGroup[1][1][0]=new Option( "加利福尼亚1 ");
secondGroup[1][1][1]=new Option( "加利福尼亚2 ");
secondGroup[1][1][2]=new Option( "加利福尼亚3 ");
secondGroup[1][1][3]=new Option( "加利福尼亚4 ");
secondGroup[1][2][0]=new Option( "华盛顿州1 ");
secondGroup[1][2][1]=new Option( "华盛顿州2 ");
secondGroup[1][2][2]=new Option( "华盛顿州3 ");
secondGroup[1][2][3]=new Option( "华盛顿州4 ");
secondGroup[1][3][0]=new Option( "阿拉斯加州1 ");
secondGroup[1][3][1]=new Option( "阿拉斯加州2 ");
secondGroup[1][3][2]=new Option( "阿拉斯加州3 ");
secondGroup[1][3][3]=new Option( "阿拉斯加州4 ");
file://以下是日本第三选项
secondGroup[2][0][0]=new Option( "东京市1 ");
secondGroup[2][0][1]=new Option( "东京市2 ");
secondGroup[2][0][2]=new Option( "东京市3 ");
secondGroup[2][0][3]=new Option( "东京市4 ");
secondGroup[2][1][0]=new Option( "神奈川1 ");
secondGroup[2][1][1]=new Option( "神奈川2 ");
secondGroup[2][1][2]=new Option( "神奈川3 ");
secondGroup[2][1][3]=new Option( "神奈川4 ");
secondGroup[2][2][0]=new Option( "九州1 ");
secondGroup[2][2][1]=new Option( "九州2 ");
secondGroup[2][2][2]=new Option( "九州3 ");
secondGroup[2][2][3]=new Option( "九州4 ");
secondGroup[2][3][0]=new Option( "大阪1 ");
secondGroup[2][3][1]=new Option( "大阪2 ");
secondGroup[2][3][2]=new Option( "大阪3 ");
secondGroup[2][3][3]=new Option( "大阪4 ");
file://以下是韩国第三选项
secondGroup[3][0][0]=new Option( "韩国A1 ");
secondGroup[3][0][1]=new Option( "韩国A2 ");
secondGroup[3][0][2]=new Option( "韩国A3 ");
secondGroup[3][0][3]=new Option( "韩国A4 ");
secondGroup[3][1][0]=new Option( "韩国B1 ");
secondGroup[3][1][1]=new Option( "韩国B2 ");
secondGroup[3][1][2]=new Option( "韩国B3 ");
secondGroup[3][1][3]=new Option( "韩国B4 ");
secondGroup[3][2][0]=new Option( "韩国C1 ");
secondGroup[3][2][1]=new Option( "韩国C2 ");
secondGroup[3][2][2]=new Option( "韩国C3 ");
secondGroup[3][2][3]=new Option( "韩国C4 ");
secondGroup[3][3][0]=new Option( "韩国D1 ");
secondGroup[3][3][1]=new Option( "韩国D2 ");
secondGroup[3][3][2]=new Option( "韩国D3 ");
secondGroup[3][3][3]=new Option( "韩国D4 ");
var temp1=document.isc.stage3
function redirect1(y){
for (m=temp1.options.length-1;m> 0;m--)
temp1.options[m]=null
for (i=0;i <secondGroup[document.isc.example.options.selectedIndex][y].length;i++){
temp1.options[i]=new Option(secondGroup[document.isc.example.options.selectedIndex][y][i].text,secondGroup[document.isc.example.options.selectedIndex][y][i].value)
}
temp1.options[0].selected=true
}
</script>
</body>
</html>
[解决办法]
要做成静态的，
[解决办法]
<html>
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> 关联选择 </title>
</head>
<body onload= "SelectCity();selectarea(); ">
<p> </p>
<form name= "form1 ">
<select name= "sel " onchange= "selectarea(); ">
<option selected value= " "> -选择地区- </option>
<option value= "00 "> 华北地区 </option>
<option value= "01 "> 华东地区 </option>
<option value= "02 "> 华南地区 </option>
<option value= "03 "> 华西北地区 </option>
<option value= "04 "> 华东南地区 </option>
<option value= "05 "> 华东北地区 </option>
<option value= "06 "> 华西南地区 </option>
<option value= "07 "> 华中地区 </option>
</select>
<select onchange= "SelectCity(); " name= "selarea ">
<option selected value=> -省/直辖市- </option>
</select> <select name= "city ">
<option value selected> -地区/城市- </option>
</select> </form>
<script language= "javascript ">
var thecity = new Array( "0000北京市 ", "0100天津市 ", "0200 秦皇岛市 ", "0201沧州市 ", "0202廊坊市 ", "0203衡水市 ", "0204石家庄市 ",
"0205邯郸市 ", "0206邢台市 ", "0207保定市 ", "0208张家口市 ", "0209承德市 ", "0210唐山市 ", "0300太原市 ", "0301大同市 ",
"0302阳泉市 ", "0303长治市 ", "0304晋城市 ", "0305朔州市 ", "0306忻州地区 ", "0307晋中地区 ", "0308吕梁地区 ",
"0309临汾地区 ", "0310运城地区 ", "0400呼和浩特市 ", "0401包头市 ", "0402乌海市 ", "0403赤峰市 ", "0404乌兰察布盟 ",
"0405锡林郭勒盟 ", "0406呼伦贝尔盟 ", "0407哲里木盟 ", "0408巴彦淖尔盟 ", "0409伊克昭盟 ", "0410阿拉善盟 ",
"0411兴安盟 ", "0500沈阳市 ", "0501大连市 ", "0502鞍山市 ", "0503抚顺市 ", "0504本溪市 ", "0505丹东市 ", "0506锦州市 ",
"0507葫芦岛市 ", "0508营口市 ", "0509盘锦市 ", "0510阜新市 ", "0511辽阳市 ", "0512铁岭市 ", "0513朝阳市 ", "0600长春市 ",
"0601吉林市 ", "0602四平市 ", "0603辽源市 ", "0604通化市 ", "0605白山市 ", "0606松原市 ", "0607白城市 ", "0608延边自治州 ",
"0700哈尔滨市 ", "0701齐齐哈尔市 ", "0702鹤岗市 ", "0703双鸭山市 ", "0704鸡西市 ", "0705大庆市 ", "0706伊春市 ",
"0707牡丹江市 ", "0708佳木斯市 ", "0709七台河市 ", "0710黑河市 ", "0711绥化地区 ", "0712大兴安岭地区 ", "0800上海市 ",
"0900南京市 ", "0901徐州市 ", "0902连云港市 ", "0903淮阴市 ", "0904宿迁市 ", "0905盐城市 ", "0906扬州市 ", "0907泰州市 ",
"0908南通市 ", "0909镇江市 ", "0910常州市 ", "0911无锡市 ", "0912苏州市 ", "1000杭州市 ", "1001宁波市 ", "1002温州市 ",
"1003嘉兴市 ", "1004湖州市 ", "1005绍兴市 ", "1006金华市 ", "1007衢州市 ", "1008舟山市 ", "1009台州市 ", "1010丽水地区 ",
"1100淮北市 ", "1101芜湖市 ", "1102铜陵市 ", "1103蚌埠市 ", "1104马鞍山市 ", "1105安庆市 ", "1106黄山市 ", "1107滁州市 ",
"1108阜阳市 ", "1109宿州市 ", "1110安徽省直辖市 ", "1111巢湖地区 ", "1112宣城地区 ", "1113池州地区 ", "1114六安地区 ",
"1115合肥市 ", "1116淮南市 ", "1200福州市 ", "1201厦门市 ", "1202三明市 ", "1203莆田市 ", "1204泉州市 ", "1205漳州市 ",
"1206南平市 ", "1207龙岩市 ", "1208宁德地区 ", "1300南昌市 ", "1301景德镇市 ", "1302萍乡市 ", "1303新余市 ", "1304九江市 ",
"1305鹰谭市 ", "1306赣州市 ", "1307上饶地区 ", "1308宜春地区 ", "1309抚州地区 ", "1310吉安地区 ", "1400济南市 ",
"1401青岛市 ", "1402淄博市 ", "1403枣庄市 ", "1404东营市 ", "1405潍坊市 ", "1406烟台市 ", "1407威海市 ", "1408济宁市 ",
"1409泰安市 ", "1410日照市 ", "1411莱芜市 ", "1412德州市 ", "1413临沂市 ", "1414聊城市 ", "1415滨州地区 ", "1416菏泽地区 ",
"1500郑州市 ", "1501开封市 ", "1502洛阳市 ", "1503平顶山市 ", "1504焦作市 ", "1505鹤壁市 ", "1506新乡市 ", "1507安阳市 ",
"1508濮阳市 ", "1509许昌市 ", "1510漯河市 ", "1511山门峡市 ", "1512南阳市 ", "1513商丘市 ", "1514信阳市 ",
"1515河南省直辖区 ", "1516周口地区 ", "1517驻马店地区 ", "1600武汉市 ", "1601黄石市 ", "1602襄樊市 ", "1603十堰市 ",
"1604荆州市 ", "1605宜昌市 ", "1606鄂州市 ", "1607孝感市 ", "1608黄冈市 ", "1609咸宁市 ", "1610湖北省直辖区 ",
"1611荆门市 ", "1612恩施自治州 ", "1700长沙市 ", "1701株洲市 ", "1702湘潭市 ", "1703衡阳市 ", "1704邵阳市 ",
"1705岳阳市 ", "1706常德市 ", "1707张家界市 ", "1708湘西自治州 ", "1709郴州市 ", "1710益阳市 ", "1711永州市 ", "1712怀化市 ",
"1713娄底地区 ", "1800广州市 ", "1801深圳市 ", "1802珠海市 ", "1803汕头市 ", "1804韶关市 ", "1805河源市 ", "1806梅州市 ",
"1807惠州市 ", "1808汕尾市 ", "1809东莞市 ", "1810中山市 ", "1811江门市 ", "1812佛山市 ", "1813阳江市 ", "1814湛江市 ",
"1815茂名市 ", "1816肇庆市 ", "1817云浮市 ", "1818清远市 ", "1819潮州市 ", "1820揭阳市 ", "1900南宁市 ", "1901柳州市 ",
"1902桂州市 ", "1903梧州市 ", "1904北海市 ", "1905防城港市 ", "1906钦州市 ", "1907贵港市 ", "1908玉林市 ", "1909南宁地区 ",
"1910柳州地区 ", "1911贺州地区 ", "1912百色地区 ", "1913河池地区 ", "2000海口市 ", "2001三亚市 ", "2002文昌市 ",
[解决办法]
楼主，动态jsp+ajax完整代码在下面两个连接示例
分数拿来~
至少也该 70 分吧，哈哈
http://firedragon.javaeye.com/blog/31015
http://anweixiao.javaeye.com/blog/post/334265
[解决办法]
http://blog.csdn.net/zxmcl/archive/2007/06/12/1649427.aspx
这里有源吗,和你的一样
[解决办法]
动态的还不是在里面嵌一些JAVA代码不就行了啊，我前陈子做了个二级连动的，就是用到JAVASCRIPT
