升级联动啊。这个是从数据库取出来的还是js、写好的。我这有省级联动的例子你看下。
index.html
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div>
<select id="province" name="province" onchange="getCity(this)">
<option value="">--请选择--</option>
</select>省
<select id="city" name="city" onchange="getDistrict(this)">
<option value="">--请选择--</option>
</select>市
<select id="district" name="district">
<option value="">--请选择--</option>
</select>区/县
</div>
<script type="text/javascript" src="js/data.js" ></script>
<script type="text/javascript">
/**
* 自调用函数,页面加载所用省份数据
* @param {Object} provice 传入js中的变量proviceJson
*/
(function(provice){
// 1.禁用城市和区县乡下拉框
var city = document.getElementById("city")
var district = document.getElementById("district")
city.disabled = "disabled"
district.disabled = "disabled"
// 2.加载所有省份
for (var i = 0 i < provice.length i++) {
var provinceOption = document.createElement("option")
var provinceSelect = document.getElementById("province")
provinceOption.innerText = provice[i].name
provinceOption.value = i//循环变量i作为option的value属性值
provinceSelect.appendChild(provinceOption)
}
})(proviceJson)
/**
* 根据省份获取城市
*/
function getCity(obj) {
// 1.激活城市下拉框
var citySel = obj.nextElementSibling || obj.nextSibling
citySel.disabled = ""
// 2.清空城市下拉框上次缓存内容(查询结果)
citySel.innerHTML = ""
var cityOpt = document.createElement("option")
cityOpt.innerText = "--请选择--"
citySel.appendChild(cityOpt)
// 3.清空区县乡下拉框上次缓存内容(查询结果)
var districtSel = obj.nextElementSibling.nextElementSibling || obj.nextSibling.nextSibling
districtSel.innerHTML = ""
var cityOpt = document.createElement("option")
cityOpt.innerText = "--请选择--"
districtSel.appendChild(cityOpt)
// 4.获取所选省份下拉框value属性值
var val = obj.value
// 5.获取省份下的城市数组
var cityArr = proviceJson[val].city
for (var i = 0 i < cityArr.length i++) {
var cityOption = document.createElement("option")
var citySelect = document.getElementById("city")
cityOption.innerText = cityArr[i].name
cityOption.value = i //循环变量i作为option的value属性值
citySelect.appendChild(cityOption)
}
}
/**
* 根据城市获取区县乡
*/
function getDistrict(obj) {
// 1.激活区县乡下拉框
var districtSel = obj.nextElementSibling || obj.nextSibling
districtSel.disabled = ""
// 2.获取所选省份value属性
var proVal = (obj.previousElementSibling || obj.previousSibling).value
// 3.获取所选择城市下拉框value属性值
var cityVal = obj.value
// 4.获取省份下的城市数组
var districtArr = proviceJson[proVal].city[cityVal].districtAndCounty
for (var i = 0 i < districtArr.length i++) {
var districtOption = document.createElement("option")
var districtSelect = document.getElementById("district")
districtOption.innerText = districtArr[i]
districtOption.value = i//循环变量i作为option的value属性值
districtSelect.appendChild(districtOption)
}
}
</script>
</body>
</html>
data.js(模拟数据)
var proviceJson = [{name: "北京市",
city: [{
name: "北京市",
districtAndCounty: ["东城区", "西城区", "崇文区", "宣武区", "朝阳区", "丰台区", "石景山区", "海淀区", "门头沟区", "房山区", "通州区", "顺义区", "昌平区", "大兴区", "怀柔区", "平谷区", "密云县", "延庆县", "延庆镇"]
}]
}, {
name: "重庆市",
city: [{
name: "重庆市",
districtAndCounty: ["渝中区", "大渡口区", "江北区", "沙坪坝区", "九龙坡区", "南岸区", "北碚区", "万盛区", "双桥区", "渝北区", "巴南区", "万州区", "涪陵区", "黔江区", "长寿区", "合川市", "永川区市", "江津市", "南川市", "綦江县", "潼南县", "铜梁县", "大足县", "荣昌县", "璧山县", "垫江县", "武隆县", "丰都县", "城口县", "梁平县", "开县", "巫溪县", "巫山县", "奉节县", "云阳县", "忠县", "石柱土家族自治县", "彭水苗族土家族自治县", "酉阳土家族苗族自治县", "秀山土家族苗族自治县"]
}]
}, {
name: "河北省",
city: [{
name: "石家庄市",
districtAndCounty: ["长安区", "桥东区", "桥西区", "新华区", "裕华区", "井陉矿区", "辛集市", "藁城市", "晋州市", "新乐市", "鹿泉市", "井陉县", "微水镇", "正定县", "正定镇", "栾城县", "栾城镇", "行唐县", "龙州镇", "灵寿县", "灵寿镇", "高邑县", "高邑镇", "深泽县", "深泽镇", "赞皇县", "赞皇镇", "无极县", "无极镇", "平山县", "平山镇", "元氏县", "槐阳镇", "赵县", "赵州镇"]
}, {
name: "张家口市",
districtAndCounty: ["桥西区", "桥东区", "宣化区", "下花园区", "宣化县", "张家口市宣化区", "张北县", "张北镇", "康保县", "康保镇", "沽源县", "平定堡镇", "尚义县", "南壕堑镇", "蔚县", "蔚州镇", "阳原县", "西城镇", "怀安县", "柴沟堡镇", "万全县", "孔家庄镇", "怀来县", "沙城镇", "涿鹿县", "涿鹿镇", "赤城县", "赤城镇", "崇礼县", "西湾子镇"]
}, {
name: "承德市",
districtAndCounty: ["双桥区", "双滦区", "鹰手营子矿区", "承德县", "下板城镇", "兴隆县", "兴隆镇", "平泉县", "平泉镇", "滦平县", "滦平镇", "隆化县", "隆化镇", "丰宁满族自治县", "大阁镇", "宽城满族自治县", "宽城镇", "围场满族蒙古族自治县", "围场镇"]
}, {
name: "秦皇岛市",
districtAndCounty: ["海港区", "山海关区", "北戴河区", "昌黎县", "昌黎镇", "抚宁县", "抚宁镇", "卢龙县", "卢龙镇", "青龙满族自治县", "青龙镇"]
}]
}]
这种东西关键就是函数名和参数什么的最好别重名给你个长的,自己照着改改吧,就是那么个意思源代码复制到一个网页就可以
<SCRIPT LANGUAGE="JavaScript">
function Dyyfff()
{
this.Items = {}
}
Dyyfff.prototype.add = function(id,iArray)
{
this.Items[id] = iArray
}
Dyyfff.prototype.Exists = function(id)
{
if(typeof(this.Items[id]) == "undefined") return false
return true
}
function changfffe(vfff){
var strfff="0"
for(ifff=0ifff<vfffifff++){ strfff+=("_"+(document.getElementById(sfff[ifff]).selectedIndex-1))}
var ssfff=document.getElementById(sfff[vfff])
with(ssfff){
length = 0
options[0]=new Option(opt0[vfff],opt0[vfff])
if(vfff &&document.getElementById(sfff[vfff-1]).selectedIndex>0 || !vfff)
{
if(Dyyfff.Exists(strfff)){
arfff = Dyyfff.Items[strfff]
for(ifff=0ifff<arfff.lengthifff++)options[length]=new Option(arfff[ifff],arfff[ifff])
if(vfff)options[1].selected = true
}
}
if(++vfff<sfff.length){changfffe(vfff)}
}
}
var Dyyfff = new Dyyfff()
Dyyfff.add("0",["计算机/互联网/通讯类","市场/公关/广告类","教师类","服务类","文字/艺术/设计类","高级管理类"," 销售类","行政/人事/后勤类","物流/贸易/采购类","建筑/房地产类","翻译类","生产/营运/工程类","财务/审计/统计/金融类","医疗/护理类","咨询/顾问类","律师/法务类" ])
Dyyfff.add("0_0",["首席技术执行官","技术总监经理","信息技术经理","信息技术主管","信息技术专员","项目经理主管","项目执行协调人员","系统分析员","高级软件工程师","软件工程师","系统工程师","高级硬件工程师","硬件工程师","通信技术工程师","ERP技术/应用顾问","数据库工程师","技术支持经理","技术支持工程师","品质经理","信息安全工程师","软件测试工程师","硬件测试工程师","测试员","网站营运经理/主管","网络工程师","系统管理员/网管","网页设计/制作","Web开发工程师","网页设计美工","平面设计美工","三维动画设计工程师","技术文员/助理"])
Dyyfff.add("0_1",["市场/广告总监","市场/营销经理","市场/营销主管","市场/营销专员","市场助理","产品/品牌经理","产品/品牌主管","市场通路经理","市场通路主管","促销经理","促销主管","促销员","市场分析/调研人员","公关/会务经理","公关/会务主管 ","公关/会务专员","媒介经理","媒介人员","企业/业务发展经理","企业策划人员","广告策划/设计/文案"])
Dyyfff.add("0_2",["教师","教学/教务管理人员","助教","讲师","家教"])
Dyyfff.add("0_3",["美容/健身顾问","餐饮/娱乐经理","宾馆/酒店经理","领班","服务员","营业员/收银员/理货员","厨师","导游","司机","保安","寻呼员/话务员"])
Dyyfff.add("0_4",["编辑/作家/撰稿人","记者","校对/录入","排版设计","艺术/设计总监","影视策划/制作人员","导演","摄影师","音效师","演员/模特/主持人","平面设计/美术设计","纺织/服装设计","工业/产品设计","工艺品/珠宝设计"])
Dyyfff.add("0_5",["首席执行官/总经理","副总经理","总监","合伙人","总裁/总经理助理"])
Dyyfff.add("0_6",["销售总监","销售经理","区域销售经理","客户经理","渠道/分销经理","渠道主管","销售主管","销售代表","销售工程师","医药代表","保险代理","销售助理","商务经理","商务专员/助理","销售行政经理","销售行政主管","售前/售后技术服务经理","售前/售后技术服务主管","售前/售后技术服务工程师","售后/客户服务(非技术)经理","售后/客户服务(非技术)主管","售后/客户服务(非技术)专员","经销商"])
Dyyfff.add("0_7",["行政/人事总监","人事经理","人事主管","人事专员","人事助理","招聘经理/主管","薪资福利经理/主管","薪资福利专员/助理","培训经理/主管","培训专员/助理","行政经理/主管/办公室主任","行政专员/助理","经理助理/秘书","前台接待/总机","后勤","资料管理员","电脑操作员/打字员"])
Dyyfff.add("0_8",["物流经理","物流主管","物流专员/助理","物料经理","物料主管","采购经理","采购主管","采购员","外贸/贸易经理/主管","外贸/贸易专员/助理","业务跟单经理","高级业务跟单", "业务跟单","助理业务跟单","仓库经理/主管","仓库管理员","运输经理/主管","报关员","单证员","船务人员","快递员","理货员"])
Dyyfff.add("0_9",["建筑工程师","结构/土建工程师","电气工程师","给排水/暖通工程师","工程造价师/预结算","建筑工程管理","工程监理","室内外装潢设计","城市规划与设计","建筑制图","施工员", "房地产开发/策划","房地产评估","房地产中介/交易","物业管理"])
Dyyfff.add("0_10",["英语翻译","日语翻译","德语翻译","法语翻译","俄语翻译","西班牙语翻译","朝鲜语翻译","其他语种翻译"])
Dyyfff.add("0_11",["工厂经理/厂长","总工程师/副总工程师","项目经理/主管","项目工程师","营运经理","营运主管","生产经理/车间主任","生产计划协调员","生产主管/督导/领班","技术/工艺设计经理/主管","技术/工艺设计工程师","实验室负责人/工程师","工程/设备经理","工程/设备主管","工程/设备工程师","电气/电子工程师","机械工程师","机电工程师","维修工程师","质量经理","质量主管","质量工程师","质量检验员/测试员","认证工程师","安全/健康/环境经理/主管","安全/健康/环境工程师","工程绘图员","机械制图员","化验员","技工","电工","服装打样/制版"])
Dyyfff.add("0_12",["财务总监","财务经理","财务主管/总帐主管 ","会计经理/会计主管","会计","出纳员","财务/会计助理","财务分析经理/主管 ","财务分析员","成本经理/成本主管","成本管理员","审计经理/主管","审计专员/助理","税务经理/税务主管","税务专员","证券经纪人","投资顾问","注册分析师","投资/基金项目经理","融资经理/融资主管","融资专员","行长/副行长","风险控制","进出口/信用证结算","清算人员","外汇主管","高级客户经理/客户经理","客户主管/专员","信贷/信用调查/分析人员","银行柜台出纳","统计员"])
Dyyfff.add("0_13",[
"医生(中\西医","医学管理人员","医药技术人员","药库主任/药剂师 ","护士/护理人员","临床协调员","临床研究员","麻醉师","心理医生","医药学检验"])
Dyyfff.add("0_14",["专业顾问","咨询总监","咨询经理","咨询员"])
Dyyfff.add("0_15",["律师","法务人员","律师助理","书记员"])
//-->
</SCRIPT>
<SCRIPT LANGUAGE = JavaScript>
var sfff=["sfff1","sfff2"]
var opt0 = ["职位类别不限","不限"]
function setupfff()
{
for(ifff=0ifff<sfff.length-1ifff++)
document.getElementById(sfff[ifff]).onchange=new Function("changfffe("+(ifff+1)+")")
changfffe(0)
}
//##联动菜单结束-->
</SCRIPT>
<!--又是可恶的二级联动-->
<!---------------------------------------->
<SCRIPT LANGUAGE="JavaScript">
<!-- ###中国省市二级联动菜单开始##如有问题请到http://hi.baidu.com/51site找我!##
function Dyyeee()
{
this.Items = {}
}
Dyyeee.prototype.add = function(id,iArray)
{
this.Items[id] = iArray
}
Dyyeee.prototype.Exists = function(id)
{
if(typeof(this.Items[id]) == "undefined") return false
return true
}
function changeeee(veee){
var streee="0"
for(ieee=0ieee<veeeieee++){ streee+=("_"+(document.getElementById(seee[ieee]).selectedIndex-1))}
var sseee=document.getElementById(seee[veee])
with(sseee){
length = 0
options[0]=new Option(opt0[veee],opt0[veee])
if(veee &&document.getElementById(seee[veee-1]).selectedIndex>0 || !veee)
{
if(Dyyeee.Exists(streee)){
areee = Dyyeee.Items[streee]
for(ieee=0ieee<areee.lengthieee++)options[length]=new Option(areee[ieee],areee[ieee])
if(veee)options[1].selected = true
}
}
if(++veee<seee.length){changeeee(veee)}
}
}
var Dyyeee = new Dyyeee()
Dyyeee.add("0",["北京市","天津市","河北省","山西省","内蒙古","辽宁省","吉林省","黑龙江省","上海市","江苏省","浙江省","安徽省","福建省","江西省","山东省","河南省","湖北省","湖南省","广东省","广西自治区","海南省","重庆市","四川省","贵州省","云南省","西藏自治区","陕西省","甘肃省","青海省","宁夏回族自治区","新疆维吾尔自治区","香港特别行政区","澳门特别行政区","台湾省","其它"])
Dyyeee.add("0_0",["东城区","西城区","崇文区","宣武区","朝阳区","丰台区","石景山区"," 海淀区(中关村)","门头沟区","房山区","通州区","顺义区","昌平区","大兴区","怀柔区","平谷区","密云县","延庆县","其他"])
Dyyeee.add("0_1",["河东区","河西区","南开区","红桥区","塘沽区","汉沽区","大港区","西青区","津南区","武清区","蓟县","宁河县","静海县","其他"])
Dyyeee.add("0_2",["张家口市","承德市","秦皇岛市","唐山市","廊坊市","衡水市","沧州市","邢台市","邯郸市","保定市","其他"])
Dyyeee.add("0_3",["太原市","朔州市","大同市","长治市","晋城市","忻州市","晋中市","临汾市","吕梁市","运城市","其他"])
Dyyeee.add("0_4",["呼和浩特市","包头市","赤峰市","呼伦贝尔市","鄂尔多斯市","乌兰察布市","巴彦淖尔市","兴安盟","阿拉善盟","锡林郭勒盟","其他"])
Dyyeee.add("0_5",["沈阳市","朝阳市","阜新市","铁岭市","抚顺市","丹东市","本溪市","辽阳市","鞍山市","大连市","营口市","盘锦市","锦州市","葫芦岛市","其他"])
Dyyeee.add("0_6",["长春市","白城市","吉林市","四平市","辽源市","通化市","白山市","延边朝鲜族自治州","其他"])
Dyyeee.add("0_7",["哈尔滨市","七台河市","黑河市","大庆市","齐齐哈尔市","伊春市","佳木斯市","双鸭山市","鸡西市","大兴安岭地区(加格达奇)","牡丹江","鹤岗市","绥化市 ","其他"])
Dyyeee.add("0_8",["黄浦区","卢湾区","徐汇区","长宁区","静安区","普陀区","闸北区","虹口区","杨浦区","闵行区","宝山区","嘉定区","浦东新区","金山区","松江区","青浦区","南汇区","奉贤区","崇明县","其他"])
Dyyeee.add("0_9",["南京市","徐州市","连云港市","宿迁市","淮安市","盐城市","扬州市","泰州市","南通市","镇江市","常州市","无锡市","苏州市","其他"])
Dyyeee.add("0_10",["杭州市","湖州市","嘉兴市","舟山市","宁波市","绍兴市","衢州市","金华市","台州市","温州市","丽水市","其他"])
Dyyeee.add("0_11",["合肥市","宿州市","淮北市","亳州市","阜阳市","蚌埠市","淮南市","滁州市","马鞍山市","芜湖市","铜陵市","安庆市","黄山市","六安市","巢湖市","池州市","宣城市","其他"])
Dyyeee.add("0_12",["福州市","南平市","莆田市","三明市","泉州市","厦门市","漳州市","龙岩市","宁德市","其他"])
Dyyeee.add("0_13",["南昌市","九江市","景德镇市","鹰潭市","新余市","萍乡市","赣州市","上饶市","抚州市","宜春市","吉安市","其他"])
Dyyeee.add("0_14",["济南市","聊城市","德州市","东营市","淄博市","潍坊市","烟台市","威海市","青岛市","日照市","临沂市","枣庄市","济宁市","泰安市","莱芜市","滨州市","菏泽市","其他"])
Dyyeee.add("0_15",["郑州市","三门峡市","洛阳市","焦作市","新乡市","鹤壁市","安阳市","濮阳市","开封市","商丘市","许昌市","漯河市","平顶山市","南阳市","信阳市","周口市","驻马店市","其他"])
Dyyeee.add("0_16",["武汉市","十堰市","襄樊市","荆门市","孝感市","黄冈市","鄂州市","黄石市","咸宁市","荆州市","宜昌市","随州市","恩施土家族苗族自治州","仙桃市","天门市","潜江市","神农架林区","其他"])
Dyyeee.add("0_17",["长沙市","张家界市","常德市","益阳市","岳阳市","株洲市","湘潭市","衡阳市","郴州市","永州市","邵阳市","怀化市","娄底市","湘西土家族苗族自治州","其他"])
Dyyeee.add("0_18",["广州市","清远市市","韶关市","河源市","梅州市","潮州市","汕头市","揭阳市","汕尾市","惠州市","东莞市","深圳市","珠海市","中山市","江门市","佛山市","肇庆市","云浮市","阳江市","茂名市","湛江市","其他"])
Dyyeee.add("0_19",["南宁市","桂林市","柳州市","梧州市","贵港市","玉林市","钦州市","北海市","防城港市","崇左市","百色市","河池市","来宾市","贺州市","其他"])
Dyyeee.add("0_20",["海口市","三亚市","其他"])
Dyyeee.add("0_21",["渝中区","大渡口区","江北区","沙坪坝区","九龙坡区","南岸区","北碚区","万盛区","双桥区","渝北区","巴南区","万州区","涪陵区","黔江区","长寿区","合川市","永川市","江津市","南川市","綦江县","潼南县","铜梁县","大足县","璧山县","垫江县","武隆县","丰都县","城口县","开县","巫溪县","巫山县","奉节县","云阳县","忠县","石柱土家族自治县","彭水苗族土家族自治县","酉阳土家族苗族自治县","秀山土家族苗族自治县","其他"])
Dyyeee.add("0_22",["成都市","广元市","绵阳市","德阳市","南充市","广安市","遂宁市","内江市","乐山市","自贡市","泸州市","宜宾市","攀枝花市","巴中市","资阳市","眉山市","雅安","阿坝藏族羌族自治州","甘孜藏族自治州","凉山彝族自治州县","其他"])
Dyyeee.add("0_23",["贵阳市","六盘水市","遵义市","安顺市","毕节地区","铜仁地区","黔东南苗族侗族自治州","黔南布依族苗族自治州","黔西南布依族苗族自治州","其他"])
Dyyeee.add("0_24",["昆明市","曲靖市","玉溪市","保山市","昭通市","丽江市","普洱市","临沧市","宁德市","德宏傣族景颇族自治州","怒江僳僳族自治州","楚雄彝族自治州","红河哈尼族彝族自治州","文山壮族苗族自治州","大理白族自治州","迪庆藏族自治州","西双版纳傣族自治州","其他"])
Dyyeee.add("0_25",["拉萨市","那曲地区","昌都地区","林芝地区","山南地区","日喀则地区","阿里地区","其他"])
Dyyeee.add("0_26",["西安市","延安市","铜川市","渭南市","咸阳市","宝鸡市","汉中市","安康市","商洛市","其他"])
Dyyeee.add("0_27",["兰州市 ","嘉峪关市","金昌市","白银市","天水市","武威市","酒泉市","张掖市","庆阳市","平凉市","定西市","陇南市","临夏回族自治州","甘南藏族自治州","其他"])
Dyyeee.add("0_28",["西宁市","海东地区","海北藏族自治州","黄南藏族自治州","玉树藏族自治州","海南藏族自治州","果洛藏族自治州","海西蒙古族藏族自治州","其他"])
Dyyeee.add("0_29",["银川市","石嘴山市","吴忠市","固原市","中卫市","其他"])
Dyyeee.add("0_30",["乌鲁木齐市","克拉玛依市","喀什地区","阿克苏地区","和田地区","吐鲁番地区","哈密地区","塔城地区","阿勒泰地区","克孜勒苏柯尔克孜自治州","博尔塔拉蒙古自治州","昌吉回族自治州 伊犁哈萨克自治州","巴音郭楞蒙古自治州","河子市","阿拉尔市","五家渠市","图木舒克市","其他"])
Dyyeee.add("0_31",["香港","其他"])
Dyyeee.add("0_31",["澳门","其他"])
Dyyeee.add("0_32",["台湾","其他"])
//-->
</SCRIPT>
<SCRIPT LANGUAGE = JavaScript>
var seee=["seee1","seee2"]
var opt0 = ["工作省份不限","工作城市不限"]
function setupeee()
{
for(ieee=0ieee<seee.length-1ieee++)
document.getElementById(seee[ieee]).onchange=new Function("changeeee("+(ieee+1)+")")
changeeee(0)
}
//##联动菜单结束-->
</SCRIPT>
<select name="" style="width:180px" id="sfff1"></select>
<select name="ss_find_post" style="width:180px" id="sfff2"></select>
<SCRIPT language="javascript">
setupfff()
</SCRIPT>
<select name="ss_seee1" style="width:180px" id="seee1"></select>
<select name="ss_sub_seee1" style="width:180px" id="seee2"> </select>
<SCRIPT language="javascript">
setupeee()
</SCRIPT>