JS实多级联动下拉菜单类,简单实现省市区联动菜单!


Posted in Javascript onMay 03, 2007

作者:ybcola 
这段js代码是很久以前的作品了,应该在一年以前吧!当时是在做一个农村人才管理系统的时候遇到的问题,因为系统要求参选择并通过后台添加省市区县甚至到乡镇村队,而在对人才的信息进行修改时要求用下拉列表进行选择,并且每个人才来源可能是省市,或者省市区县,或者一直取队都要选择!那时第一反映就是找网上是否有现成的代码,找到一个最常用的就是省市二级联动,那时那段js代码在网上随处可见,可是拿过来对我来说没用,因为我需要的是一个多级联通并且可以自由扩展的代码!最终还是自己动手写了JS代码。

为了考虑在同一个页面中多处使用,因些使用了对象的思想进行设计,为了实现各个多级联动的内容不同,所以把内空数据结构与程序进行了分离,因此设计最终调用方法如:

 var city=new LightManAddressTree;
 city.selectshow(obj,0); //obj为要添加到的dom结点,

 如有html代码如下<div id="abc"></div>
那么调用方法就应该为
obj=document.getElementById("abc");
 var city=new LightManAddressTree;
 city.selectshow(obj,0);
这样多级联动内容就为显示在闭合的div标签内的位置
 其js设计代码如下:

//定义地址数据开始 
var AddressTree={}; 
AddressTree["a_row"]=new Array(); //存所有记录 
with(AddressTree){ 
a_row["1"]=["北京市",0,1]; 
a_row["2"]=["上海市",0,1]; 
a_row["3"]=["天津市",0,1]; 
a_row["4"]=["重庆市",0,1]; 
a_row["5"]=["河北",0,0]; 
a_row["6"]=["山西",0,0]; 
a_row["7"]=["内蒙古",0,0]; 
a_row["8"]=["辽宁",0,0]; 
a_row["9"]=["吉林",0,0]; 
a_row["10"]=["黑龙江",0,0]; 
a_row["11"]=["江苏",0,0]; 
a_row["12"]=["渐江",0,0]; 
a_row["13"]=["安徽",0,0]; 
a_row["14"]=["福建",0,0]; 
a_row["15"]=["江西",0,0]; 
a_row["16"]=["山东",0,0]; 
a_row["17"]=["河南",0,0]; 
a_row["18"]=["湖北",0,0]; 
a_row["19"]=["湖南",0,0]; 
a_row["20"]=["广东",0,0]; 
a_row["21"]=["广西",0,0]; 
a_row["22"]=["海南",0,0]; 
a_row["23"]=["四川",0,0]; 
a_row["24"]=["贵州",0,0]; 
a_row["25"]=["云南",0,0]; 
a_row["26"]=["西藏",0,0]; 
a_row["27"]=["陕西",0,0]; 
a_row["28"]=["甘肃",0,0]; 
a_row["29"]=["青海",0,0]; 
a_row["30"]=["宁夏",0,0]; 
a_row["31"]=["新??,0,0]; 
a_row["32"]=["香港",0,1]; 
a_row["33"]=["澳门",0,1]; 
a_row["34"]=["台湾",0,0]; 
a_row["35"]=["石家庄",5,1]; 
a_row["36"]=["唐山",5,1]; 
a_row["37"]=["秦皇岛",5,1]; 
a_row["38"]=["邯郸",5,1]; 
a_row["39"]=["邢台",5,1]; 
a_row["40"]=["保定",5,1]; 
a_row["41"]=["张家口",5,1]; 
a_row["42"]=["承德",5,1]; 
a_row["43"]=["沧州",5,1]; 
a_row["44"]=["廊坊",5,1]; 
a_row["45"]=["衡水",5,1]; 
a_row["46"]=["太原",6,1]; 
a_row["47"]=["大同",6,1]; 
a_row["48"]=["阳泉",6,1]; 
a_row["49"]=["长治",6,1]; 
a_row["50"]=["晋城",6,1]; 
a_row["51"]=["朔州",6,1]; 
a_row["52"]=["晋中",6,1]; 
a_row["53"]=["运城",6,1]; 
a_row["54"]=["忻州",6,1]; 
a_row["55"]=["临汾",6,1]; 
a_row["56"]=["吕梁",6,1]; 
a_row["58"]=["呼和浩特",7,1]; 
a_row["59"]=["包头",7,1]; 
a_row["60"]=["乌海",7,1]; 
a_row["61"]=["赤峰",7,1]; 
a_row["62"]=["通辽",7,1]; 
a_row["63"]=["鄂尔多斯",7,1]; 
a_row["64"]=["呼伦贝尔",7,1]; 
a_row["65"]=["乌兰察布市",7,1]; 
a_row["66"]=["锡林郭勒盟",7,1]; 
a_row["67"]=["巴彦淖尔盟",7,1]; 
a_row["68"]=["阿拉善盟",7,1]; 
a_row["69"]=["兴安盟",7,1]; 
a_row["70"]=["沈阳",8,1]; 
a_row["71"]=["大连",8,1]; 
a_row["72"]=["鞍山",8,1]; 
a_row["73"]=["抚顺",8,1]; 
a_row["74"]=["本溪",8,1]; 
a_row["75"]=["丹东",8,1]; 
a_row["76"]=["锦州",8,1]; 
a_row["77"]=["葫芦岛",8,1]; 
a_row["78"]=["营口",8,1]; 
a_row["79"]=["盘锦",8,1]; 
a_row["80"]=["阜新",8,1]; 
a_row["81"]=["辽阳",8,1]; 
a_row["82"]=["铁岭",8,1]; 
a_row["83"]=["朝阳",8,1]; 
a_row["84"]=["长春",9,1]; 
a_row["85"]=["吉林",9,1]; 
a_row["86"]=["四平",9,1]; 
a_row["87"]=["辽源",9,1]; 
a_row["88"]=["通化",9,1]; 
a_row["89"]=["白山",9,1]; 
a_row["90"]=["松原",9,1]; 
a_row["91"]=["白城",9,1]; 
a_row["92"]=["延办朝鲜族自治州",9,1]; 
a_row["93"]=["哈尔滨",10,1]; 
a_row["94"]=["齐齐哈尔",10,1]; 
a_row["95"]=["鹤岗",10,1]; 
a_row["96"]=["双鸭山",10,1]; 
a_row["97"]=["鸡西",10,1]; 
a_row["98"]=["大庆",10,1]; 
a_row["99"]=["伊春",10,1]; 
a_row["100"]=["牡丹江",10,1]; 
a_row["101"]=["佳木斯",10,1]; 
a_row["102"]=["七台河",10,1]; 
a_row["103"]=["黑河",10,1]; 
a_row["104"]=["绥化",10,1]; 
a_row["105"]=["大兴安岭",10,1]; 
a_row["106"]=["南京",11,1]; 
a_row["107"]=["无锡",11,1]; 
a_row["108"]=["徐州",11,1]; 
a_row["109"]=["常州",11,1]; 
a_row["110"]=["苏州",11,1]; 
a_row["111"]=["南通",11,1]; 
a_row["112"]=["连云港",11,1]; 
a_row["113"]=["淮安",11,1]; 
a_row["114"]=["盐城",11,1]; 
a_row["115"]=["扬州",11,1]; 
a_row["116"]=["镇江",11,1]; 
a_row["117"]=["泰州",11,1]; 
a_row["118"]=["宿?",11,1]; 
a_row["119"]=["杭州",12,1]; 
a_row["120"]=["宁波",12,1]; 
a_row["121"]=["温州",12,1]; 
a_row["122"]=["嘉兴",12,1]; 
a_row["123"]=["湖州",12,1]; 
a_row["124"]=["绍兴",12,1]; 
a_row["125"]=["金华",12,1]; 
a_row["126"]=["舟山",12,1]; 
a_row["127"]=["台州",12,1]; 
a_row["128"]=["丽水",12,1]; 
a_row["129"]=["衢州",12,1]; 
a_row["130"]=["合肥",13,1]; 
a_row["131"]=["芜湖",13,1]; 
a_row["132"]=["蚌埠",13,1]; 
a_row["133"]=["淮南",13,1]; 
a_row["134"]=["马鞍山",13,1]; 
a_row["135"]=["淮北",13,1]; 
a_row["136"]=["铜陵",13,1]; 
a_row["137"]=["安庆",13,1]; 
a_row["138"]=["黄山",13,1]; 
a_row["139"]=["滁州",13,1]; 
a_row["140"]=["阜阳",13,1]; 
a_row["141"]=["宿州",13,1]; 
a_row["142"]=["巢湖",13,1]; 
a_row["143"]=["六安",13,1]; 
a_row["144"]=["毫州",13,1]; 
a_row["145"]=["池州",13,1]; 
a_row["146"]=["宣城",13,1]; 
a_row["147"]=["福州",14,1]; 
a_row["148"]=["厦门",14,1]; 
a_row["149"]=["莆田",14,1]; 
a_row["150"]=["三明",14,1]; 
a_row["151"]=["泉州",14,1]; 
a_row["152"]=["漳州",14,1]; 
a_row["153"]=["南平",14,1]; 
a_row["154"]=["龙岩",14,1]; 
a_row["155"]=["宁德",14,1]; 
a_row["156"]=["南昌",15,1]; 
a_row["157"]=["景德镇",15,1]; 
a_row["158"]=["萍乡",15,1]; 
a_row["159"]=["新余",15,1]; 
a_row["160"]=["九江",15,1]; 
a_row["161"]=["鹰潭",15,1]; 
a_row["162"]=["吉安",15,1]; 
a_row["163"]=["宜春",15,1]; 
a_row["164"]=["抚州",15,1]; 
a_row["165"]=["上饶",15,1]; 
a_row["166"]=["赣州",15,1]; 
a_row["167"]=["济南",16,1]; 
a_row["168"]=["青岛",16,1]; 
a_row["169"]=["淄博",16,1]; 
a_row["170"]=["枣庄",16,1]; 
a_row["171"]=["东营",16,1]; 
a_row["172"]=["潍坊",16,1]; 
a_row["173"]=["烟台",16,1]; 
a_row["174"]=["威海",16,1]; 
a_row["175"]=["济宁",16,1]; 
a_row["176"]=["泰安",16,1]; 
a_row["177"]=["日照",16,1]; 
a_row["178"]=["莱芜",16,1]; 
a_row["179"]=["德州",16,1]; 
a_row["180"]=["临沂",16,1]; 
a_row["181"]=["聊城",16,1]; 
a_row["182"]=["滨州",16,1]; 
a_row["183"]=["菏泽",16,1]; 
a_row["184"]=["郑州",17,1]; 
a_row["185"]=["开封",17,1]; 
a_row["186"]=["洛阳",17,1]; 
a_row["187"]=["平顶山",17,1]; 
a_row["188"]=["焦作",17,1]; 
a_row["189"]=["鹤壁",17,1]; 
a_row["190"]=["新乡",17,1]; 
a_row["191"]=["安阳",17,1]; 
a_row["192"]=["濮阳",17,1]; 
a_row["193"]=["许昌",17,1]; 
a_row["194"]=["漯河",17,1]; 
a_row["195"]=["三门峡",17,1]; 
a_row["196"]=["南阳",17,1]; 
a_row["197"]=["南丘",17,1]; 
a_row["198"]=["信阳",17,1]; 
a_row["199"]=["周口",17,1]; 
a_row["200"]=["驻马店",17,1]; 
a_row["201"]=["济源",17,1]; 
a_row["202"]=["武汉",18,1]; 
a_row["203"]=["黄石",18,1]; 
a_row["204"]=["襄樊",18,1]; 
a_row["205"]=["十堰",18,1]; 
a_row["206"]=["荆州",18,1]; 
a_row["207"]=["宜昌",18,1]; 
a_row["208"]=["荆门",18,1]; 
a_row["209"]=["鄂州",18,1]; 
a_row["210"]=["孝感",18,1]; 
a_row["211"]=["黄冈",18,1]; 
a_row["212"]=["咸宁",18,1]; 
a_row["213"]=["随州",18,1]; 
a_row["214"]=["仙桃",18,1]; 
a_row["215"]=["天门",18,1]; 
a_row["216"]=["潜江",18,1]; 
a_row["217"]=["神农架",18,1]; 
a_row["218"]=["恩施土家族自治州",18,1]; 
a_row["219"]=["长沙",19,1]; 
a_row["220"]=["株洲",19,1]; 
a_row["221"]=["湘潭",19,1]; 
a_row["222"]=["衡阳",19,1]; 
a_row["223"]=["邵阳",19,1]; 
a_row["224"]=["岳阳",19,1]; 
a_row["225"]=["常德",19,1]; 
a_row["226"]=["张家界",19,1]; 
a_row["227"]=["益阳",19,1]; 
a_row["228"]=["郴州",19,1]; 
a_row["229"]=["怀化",19,1]; 
a_row["230"]=["娄底",19,1]; 
a_row["231"]=["湘西土家族苗族自治州",19,1]; 
a_row["232"]=["广州",20,1]; 
a_row["233"]=["深圳",20,1]; 
a_row["234"]=["珠海",20,1]; 
a_row["235"]=["汕头",20,1]; 
a_row["236"]=["韶关",20,1]; 
a_row["237"]=["佛山",20,1]; 
a_row["238"]=["江门",20,1]; 
a_row["239"]=["湛江",20,1]; 
a_row["240"]=["茂名",20,1]; 
a_row["241"]=["肇庆",20,1]; 
a_row["242"]=["惠州",20,1]; 
a_row["243"]=["梅州",20,1]; 
a_row["244"]=["汕尾",20,1]; 
a_row["245"]=["河源",20,1]; 
a_row["246"]=["阳江",20,1]; 
a_row["247"]=["清远",20,1]; 
a_row["248"]=["东莞",20,1]; 
a_row["249"]=["中山",20,1]; 
a_row["250"]=["潮州",20,1]; 
a_row["251"]=["揭阳",20,1]; 
a_row["252"]=["云浮",20,1]; 
a_row["253"]=["南宁",21,1]; 
a_row["254"]=["柳州",21,1]; 
a_row["255"]=["桂林",21,1]; 
a_row["256"]=["梧州",21,1]; 
a_row["257"]=["北海",21,1]; 
a_row["258"]=["防城港",21,1]; 
a_row["259"]=["钦州",21,1]; 
a_row["260"]=["贵港",21,1]; 
a_row["261"]=["玉林",21,1]; 
a_row["262"]=["百色",21,1]; 
a_row["263"]=["贺州",21,1]; 
a_row["264"]=["河池",21,1]; 
a_row["265"]=["来宾",21,1]; 
a_row["266"]=["崇左",21,1]; 
a_row["267"]=["海口",22,1]; 
a_row["268"]=["三亚",22,1]; 
a_row["269"]=["五指山",22,1]; 
a_row["270"]=["琼海",22,1]; 
a_row["271"]=["儋州",22,1]; 
a_row["272"]=["文昌",22,1]; 
a_row["273"]=["方宁",22,1]; 
a_row["274"]=["东方",22,1]; 
a_row["275"]=["澄迈",22,1]; 
a_row["276"]=["定安",22,1]; 
a_row["277"]=["屯昌",22,1]; 
a_row["278"]=["临高",22,1]; 
a_row["279"]=["白沙黎族自治县",22,1]; 
a_row["280"]=["江黎族自治县",22,1]; 
a_row["281"]=["乐东黎族自治县",22,1]; 
a_row["282"]=["陵水黎族自治县",22,1]; 
a_row["283"]=["保亭黎族苗族自治县",22,1]; 
a_row["284"]=["琼中称许苗族自治县",22,1]; 
a_row["285"]=["成都",23,1]; 
a_row["286"]=["自贡",23,1]; 
a_row["287"]=["攀枝花",23,1]; 
a_row["288"]=["泸州",23,1]; 
a_row["289"]=["德阳",23,1]; 
a_row["290"]=["绵阳",23,1]; 
a_row["291"]=["广元",23,1]; 
a_row["292"]=["遂宁",23,1]; 
a_row["293"]=["内江",23,1]; 
a_row["294"]=["乐山",23,1]; 
a_row["295"]=["南充",23,1]; 
a_row["296"]=["宜宾",23,1]; 
a_row["297"]=["广安",23,1]; 
a_row["298"]=["达州",23,1]; 
a_row["299"]=["眉山",23,1]; 
a_row["300"]=["雅安",23,1]; 
a_row["301"]=["巴中",23,1]; 
a_row["302"]=["资阳",23,1]; 
a_row["303"]=["阿坝藏族羌族自治州",23,1]; 
a_row["304"]=["甘孜藏族自治州",23,1]; 
a_row["305"]=["凉山彝族自治州",23,1]; 
a_row["306"]=["贵阳",24,1]; 
a_row["307"]=["六盘水",24,1]; 
a_row["308"]=["遵义",24,1]; 
a_row["309"]=["安顺",24,1]; 
a_row["310"]=["铜仁",24,1]; 
a_row["311"]=["毕节",24,1]; 
a_row["312"]=["黔西南布依族苗族自治州",24,1]; 
a_row["313"]=["黔东南苗族自治州",24,1]; 
a_row["314"]=["黔南布依族苗族自治州",24,1]; 
a_row["315"]=["昆明",25,1]; 
a_row["316"]=["曲靖",25,1]; 
a_row["317"]=["玉溪",25,1]; 
a_row["318"]=["保山",25,1]; 
a_row["319"]=["昭通",25,1]; 
a_row["320"]=["丽江",25,1]; 
a_row["321"]=["思茅",25,1]; 
a_row["322"]=["监沧",25,1]; 
a_row["323"]=["文山壮族苗族自治州",25,1]; 
a_row["324"]=["红河哈尼族彝族自治州",25,1]; 
a_row["325"]=["西双版纳傣族自治州",25,1]; 
a_row["326"]=["楚雄彝族自治州",25,1]; 
a_row["327"]=["大理白族自治州",25,1]; 
a_row["328"]=["德宏傣族景颇族自治州",25,1]; 
a_row["329"]=["怒江僳僳族自治州",25,1]; 
a_row["330"]=["迪庆藏族自治州",25,1]; 
a_row["331"]=["拉萨",26,1]; 
a_row["332"]=["那曲",26,1]; 
a_row["333"]=["昌都",26,1]; 
a_row["334"]=["山南",26,1]; 
a_row["335"]=["日喀则",26,1]; 
a_row["336"]=["阿里",26,1]; 
a_row["337"]=["林芝",26,1]; 
a_row["338"]=["西安",27,1]; 
a_row["339"]=["铜川",27,1]; 
a_row["340"]=["宝鸡",27,1]; 
a_row["341"]=["咸阳",27,1]; 
a_row["342"]=["渭南",27,1]; 
a_row["343"]=["延安",27,1]; 
a_row["344"]=["汉中",27,1]; 
a_row["345"]=["榆林",27,1]; 
a_row["346"]=["安康",27,1]; 
a_row["347"]=["商洛",27,1]; 
a_row["348"]=["兰州",28,1]; 
a_row["349"]=["金昌",28,1]; 
a_row["350"]=["白银",28,1]; 
a_row["351"]=["天水",28,1]; 
a_row["352"]=["嘉峪关",28,1]; 
a_row["353"]=["武威",28,1]; 
a_row["354"]=["张掖",28,1]; 
a_row["355"]=["平凉",28,1]; 
a_row["356"]=["洒泉",28,1]; 
a_row["357"]=["庆阳",28,1]; 
a_row["358"]=["定西",28,1]; 
a_row["359"]=["陇南",28,1]; 
a_row["360"]=["临夏回族自治州",28,1]; 
a_row["361"]=["甘南藏族自治州",28,1]; 
a_row["362"]=["西宁",29,1]; 
a_row["363"]=["海东",29,1]; 
a_row["364"]=["海北藏族自治州",29,1]; 
a_row["365"]=["黄南藏族自治州",29,1]; 
a_row["366"]=["海南藏族自治州",29,1]; 
a_row["367"]=["果洛藏族自治州",29,1]; 
a_row["368"]=["玉树藏族自治州",29,1]; 
a_row["369"]=["海西蒙古藏族自治州",29,1]; 
a_row["370"]=["银川",30,1]; 
a_row["371"]=["石嘴山",30,1]; 
a_row["372"]=["吴忠",30,1]; 
a_row["373"]=["固原",30,1]; 
a_row["374"]=["乌鲁木齐",31,1]; 
a_row["375"]=["克拉玛依",31,1]; 
a_row["376"]=["石河子",31,1]; 
a_row["377"]=["阿拉尔",31,1]; 
a_row["378"]=["图木舒克",31,1]; 
a_row["379"]=["五家渠",31,1]; 
a_row["380"]=["吐鲁",31,1]; 
a_row["381"]=["哈密",31,1]; 
a_row["382"]=["和田",31,1]; 
a_row["383"]=["阿克苏",31,1]; 
a_row["384"]=["喀什",31,1]; 
a_row["385"]=["克孜勒苏柯尔克孜自治州",31,1]; 
a_row["386"]=["巴音郭楞蒙古自治州",31,1]; 
a_row["387"]=["昌吉回族自治州",31,1]; 
a_row["388"]=["博尔塔拉蒙古自治州",31,1]; 
a_row["389"]=["伊犁哈萨克自治州",31,1]; 
a_row["390"]=["台北",34,1]; 
a_row["391"]=["高雄",34,1]; 
a_row["392"]=["基隆",34,1]; 
a_row["393"]=["台中",34,1]; 
a_row["394"]=["台南",34,1]; 
a_row["395"]=["新竹",34,1]; 
a_row["396"]=["嘉义",34,1]; 
a_row["397"]=["sss",285,1]; 
} 
var j=0; 
AddressTree["a_record"]=new Array();//存储记录的记录号 
for(i in AddressTree["a_row"]){AddressTree["a_record"][j++]=i;} 
AddressTree.ObjNumber=1; 
//地址选择构造函数 
function LightManAddressTree(){ 
  var Data = AddressTree; //数据记录数据变量 
  this.noselectshow=["--请选择省份--","--请选择城市--","--请选择区县--"];//各级不选择显示值 
  this.grade=0;  //级数 
  this.idvalue=0; //地址选择值的id号 
  this.text=""; //地址字符串 
  this.listseparator=" "; //地址字符串中的分隔符号 
  this.selectName="a_tree"+(AddressTree.ObjNumber++)+"_"; 
  //定义地址数据结束 
  this.getfontpath =  function(id){ //取得指定记录号的上级路径 
    var path = "",upid; 
    try{ 
    upid=(isNaN(id)?0:id); 
    while(upid!=0){ 
        var upid=Data["a_row"][upid][1]; 
        if(path!="")path=upid+","+path;else path=upid; 
      } 
    } 
    catch(e){}; 
    return eval("["+path+"]"); 
  } 
  //建立下列表 
  this.selectshowlevel=function(obj,upid,def){ 
    var selectobj,optionobj,havedef; 
    selectobj=document.getElementById(this.selectName+this.grade); 
    if(selectobj){ 
      document.getElementById(this.selectName+this.grade).options.length=0; 
    }else{ 
      selectobj=document.createElement("select"); 
      selectobj.id=this.selectName+this.grade; 
      selectobj.grade=this.grade; 
      selectobj.obj=this; 
      selectobj.onchange=function(){ 
        if(this.options[this.selectedIndex].value!=""){ 
          this.obj.selectshow(obj,this[this.selectedIndex].value); 
        } 
        else{ 
         if(this.obj.grade>0){   
            for(var i=this.grade+1;i<this.obj.grade-1;i++){ 
              var df=document.getElementById(this.obj.selectName+i); 
              df.options.length=0; 
              defaultoption(this.obj,df,i); 
              } 
            //最得值 
            getvalue(this.obj); 
          } 
        } 
      } 
    } 
    defaultoption(this,selectobj,this.grade); 
    //显示级别下数据 
    if(upid>=0){ 
    for(var j=0;j<Data["a_record"].length;j++){ 
      thisrecord=Data["a_row"][Data["a_record"][j]]; 
      if(thisrecord[1]==upid){ 
        optionobj=document.createElement("option"); 
        optionobj.text=thisrecord[0]; 
        optionobj.value=Data["a_record"][j]; 
        selectobj.options.add(optionobj); 
        if(def==Data["a_record"][j]) havedef=true; 
    } 
  } 
  } 
  if(havedef)selectobj.value=def; 
  return selectobj; 
} this.selectshow = function(obj,id){ //显示选中记录号 
  var selectobj,optionobj,thisrecord; 
  var lastgrade,tempid=id,tempgrade; 
  var fontpath=this.getfontpath(id); 
  tempgrade=this.grade; 
  this.grade=0; 
  //显示选中前部分内容 
  for (var i=0;i<fontpath.length;i++){ 
    if(!document.getElementById(this.selectName+this.grade)){ 
      if(i<fontpath.length-1) 
        this.Add(obj,this.selectshowlevel(obj,fontpath[i],fontpath[i+1])); 
      else 
        this.Add(obj,this.selectshowlevel(obj,fontpath[i],id)); 
    } 
    this.grade++; 
  } 
  //显示选中后部分内容 
  do{ 
  lastgrade=this.selectshowlevel(obj,tempid); 
  tempid=lastgrade.value; 
  if (tempid=="")tempid=-1; 
  this.Add(obj,lastgrade); 
  this.grade++; 
  } 
  while(lastgrade.options.length>0); 
  //删除多余选项 
  for(i=this.grade-1;i<tempgrade-1;i++){ 
    obj.removeChild(document.getElementById(this.selectName+i)); 
  } 
  //最得值 
  getvalue(this); 
} 
this.Add=function(obj,s){ 
  if(s.options.length>0&&!document.getElementById(s.id))obj.appendChild(s); 
  } 
  //获取选择值 
  function getvalue(obj){ 
    var sel 
    obj.text=""; 
    obj.idvalue=0; 
    for(var i=0;i<obj.grade-1;i++){ 
      sel=document.getElementById(obj.selectName+i); 
      if(sel.value!=""){ 
        obj.text+=(obj.text.match("\\S")==null?"":obj.listseparator)+sel.options[sel.selectedIndex].text; 
        obj.idvalue=sel.options[sel.selectedIndex].value; 
        }else{break;} 
      } 
  } 
  //级别显示数据 
  function defaultoption(obj,sobj,g){ 
    try{ 
      if(obj.noselectshow[g]){ 
        optionobj=document.createElement("option"); 
        optionobj.text=obj.noselectshow[g]; 
        optionobj.value=""; 
        sobj.options.add(optionobj,0); 
        } 
      } 
      catch(e){} 
  } 
}

address_test.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>Untitled Document</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
</head> <body> 
<script type="text/javascript" src="Address.js"></script> 
</body> 
</html>
Javascript 相关文章推荐
jquery 学习笔记一
Apr 07 Javascript
Web前端设计模式  制作漂亮的弹出层
Oct 29 Javascript
javascript中的nextSibling使用陷(da)阱(keng)
May 05 Javascript
动态载入js提高网页打开速度的方法
Jul 04 Javascript
javascript仿百度输入框提示自动下拉补全
Jan 07 Javascript
JS控制页面跳转时未请求要跳转的地址怎么回事
Oct 14 Javascript
vue组件间通信子与父详解(二)
Nov 07 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
Nov 20 Javascript
layui之select的option叠加问题的解决方法
Mar 08 Javascript
35个最好用的Vue开源库(史上最全)
Jan 03 Javascript
js 数组 fill() 填充方法
Nov 02 Javascript
vue elementUI表格控制对应列
Apr 13 Vue.js
javascript静态的url如何传递
May 03 #Javascript
可以支持多中格式的JS键盘
May 02 #Javascript
javascript英文日期(有时间)选择器
May 02 #Javascript
(推荐一个超好的JS函数库)S.Sams Lifexperience ScriptClassLib
Apr 29 #Javascript
JavaScript 实现??打印?理
Apr 28 #Javascript
javascript实现的listview效果
Apr 28 #Javascript
Javascript模板技术
Apr 27 #Javascript
You might like
采用thinkphp自带方法生成静态html文件详解
2014/06/13 PHP
10个超级有用值得收藏的PHP代码片段
2015/01/22 PHP
织梦sitemap地图实时推送给百度的教程
2015/08/03 PHP
PHP工厂模式、单例模式与注册树模式实例详解
2019/06/03 PHP
thinkphp5.1框架模板赋值与变量输出示例
2020/05/25 PHP
PHP获取类私有属性的3种方法
2020/09/10 PHP
javascript KeyDown、KeyPress和KeyUp事件的区别与联系
2009/12/03 Javascript
js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
2011/01/08 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
vue分页组件table-pagebar使用实例解析
2020/11/15 Javascript
微信小程序 action-sheet底部菜单详解
2016/10/27 Javascript
Javascript中常用类型的格式化方法小结
2016/12/26 Javascript
angular框架实现全选与单选chekbox的自定义
2017/07/06 Javascript
vue2.0获取鼠标位置的方法
2018/09/13 Javascript
使用微信SDK自定义分享的方法
2019/07/03 Javascript
JS中的算法与数据结构之字典(Dictionary)实例详解
2019/08/20 Javascript
深入理解javascript prototype的相关知识
2019/09/19 Javascript
Node如何后台数据库使用增删改查功能
2019/11/21 Javascript
vue项目中js-cookie的使用存储token操作
2020/11/13 Javascript
Django框架中的对象列表视图使用示例
2015/07/21 Python
Python使用Paramiko模块编写脚本进行远程服务器操作
2016/05/05 Python
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
python opencv3实现人脸识别(windows)
2018/05/25 Python
python得到windows自启动列表的方法
2018/10/14 Python
python 哈希表实现简单python字典代码实例
2019/09/27 Python
Pycharm中配置远程Docker运行环境的教程图解
2020/06/11 Python
详解Python 函数参数的拆解
2020/09/02 Python
HTML5 中新的全局属性(整理)
2013/07/31 HTML / CSS
英国领先的男装设计师服装购物网站:Mainline Menswear
2018/02/04 全球购物
Kneipp克奈圃美国官网:德国百年精油配方的传承
2018/02/07 全球购物
.NET里面什么时候需要调用垃圾回收
2015/06/01 面试题
护理专业优质毕业生自荐书
2014/01/31 职场文书
写自荐信的注意事项
2014/03/09 职场文书
2014年档案管理员工作总结
2014/12/01 职场文书
python游戏开发Pygame框架
2022/04/22 Python
mysql查看表结构的三种方法总结
2022/07/07 MySQL