js实现城市级联选择,二级选择

js实现城市级联选择,二级选择。

代码实例:以下代码可以直接粘贴使用,但里面的城市并不完整。
实现原理是利用 js的onchang方法,调用city.js文件里的changecity()函数,var text = city[index][i].split(“-”); 这个方法是把new Array()数组拆分进text变量数组里,然后text[0]是文本区域中的值,text[1]是选中的值。

<script language=”javascript” src=”city.js”></script>

<form action=”" method=”post” name=”form2″>省份:<select name=”sf”  onchange=”changecity()” >
                <option selected>选择省份</option>
                <option value=”江苏省”>江苏省</option>
                <option value=”北京”>北京</option>
                <option value=”天津”>天津</option>
                <option value=”上海”>上海</option>
                <option value=”重庆”>重庆</option>
                <option value=”广东省”>广东省</option>
                <option value=”浙江省”>浙江省</option>
                <option value=”福建省”>福建省</option></select>
      城市:
              <SELECT name=city style=”width:80″>
                <OPTION>==所在城市==</OPTION>
              </SELECT>
 </form>

city.js 代码:

// JavaScript Document
function changecity(){
 index = form2.sf.options.selectedIndex-1;
 form2.city.length = city[index].length;
 for(var i = 0;i<city[index].length;i++)
  {
   var text = city[index][i].split(“-”);
   form2.city.options[i].text = text[0];
   form2.city.options[i].value =text[1];
  }
}var city = new Array(  
   new Array(
      //”江苏省(全部地区)-江苏省(全部地区)”,
      “江阴市-江阴市”,
      “无锡市-无锡市”,
      “宜兴市-宜兴市”,
      “常州市-常州市”,
      “南京市-南京市”,
      “溧水县-溧水县”,
      “高淳县-高淳县”,
      “苏州市-苏州市”,
      “常熟市-常熟市”,
      “张家港市-张家港市”,
      “昆山市-昆山市”,
      “吴江市-吴江市”,
      “太仓市-太仓市”,
      “溧阳市-溧阳市”,
      “金坛市-金坛市”,
      “南通市-南通市”,
      “海安县-海安县”,
      “如东县-如东县”,
      “启东市-启东市”,
      “如皋市-如皋市”,
      “通州市-通州市”,
      “海门市-海门市”,
      “镇江市-镇江市”,
      “丹阳市-丹阳市”,
      “扬中市-扬中市”,
      “句容市-句容市”,
      “徐州市-徐州市”,
      “丰县-丰县”,
      “沛县-沛县”,
      “铜山县-铜山县”,
      “睢宁县-睢宁县”,
      “新沂市-新沂市”,
      “邳州市-邳州市”,
      “连云港市-连云港市”,
      “赣榆县-赣榆县”,
      “东海县-东海县”,
      “灌云县-灌云县”,
      “淮安市-淮安市”,
      “涟水县-涟水县”,
      “洪泽县-洪泽县”,
      “盱眙县-盱眙县”,
      “金湖县-金湖县”,
      “盐城市-盐城市”,
      “响水县-响水县”,
      “滨海县-滨海县”,
      “阜宁县-阜宁县”,
      “射阳县-射阳县”,
      “建湖县-建湖县”,
      “盐都县-盐都县”,
      “东台县-东台县”,
      “大丰市-大丰市”,
      “扬州市-扬州市”,
      “宝应县-宝应县”,
      “仪征县-仪征县”,
      “高邮市-高邮市”,
      “江都市-江都市”,
      “宿迁市-宿迁市”,
      “宿豫县-宿豫县”,
      “沭阳县-沭阳县”,
      “泗阳县-泗阳县”,
      “泗洪县-泗洪县”,
      “泰州市-泰州市”,
      “兴化市-兴化市”,
      “靖江市-靖江市”,
      “泰兴市-泰兴市”,
      “姜堰市-姜堰市”),
    new Array(“北京-北京”),
    new Array(“天津-天津”),
    new Array(“上海-上海”),
    new Array(“重庆-重庆”),
    new Array(
      //”广东省 (全部地区)-广东省 (全部地区)”,
      “广州-广州”,
      “深圳-深圳”,
      “东莞-东莞”,
      “中山-中山”,
      “佛山-佛山”,
      “珠海-珠海”,
      “惠州-惠州”,
      “汕头-汕头”,
      “湛江-湛江”,
      “潮州-潮州”,
      “潮阳-潮阳”,
      “江门-江门”,
      “汕尾-汕尾”,
      “茂名-茂名”,
      “阳江-阳江”,
      “肇庆-肇庆”,
      “梅州-梅州”,
      “云浮-云浮”,
      “清远-清远”,
      “韶关-韶关”,
      “河源-河源”,
      “揭阳-揭阳”,
      “其他-其他”),
    new Array(
      //”浙江省(全部地区)-浙江省(全部地区)”,
      “杭州-杭州”,
      “宁波-宁波”,
      “温州-温州”,
      “金华-金华”,
      “义乌-义乌”,
      “绍兴-绍兴”,
      “湖州-湖州”,
      “余姚-余姚”,
      “临海-临海”,
      “萧山-萧山”,
      “临安-临安”,
      “诸暨-诸暨”,
      “嵊泗-嵊泗”,
      “兰溪-兰溪”,
      “嘉兴-嘉兴”,
      “海宁-海宁”,
      “桐乡-桐乡”,
      “衢州-衢州”,
      “上虞-上虞”,
      “嵊州-嵊州”,
      “慈溪-慈溪”,
      “丽水-丽水”,
      “瓯海-瓯海”,
      “黄岩-黄岩”,
      “椒江-椒江”,
      “其他-其他”),
    new Array(
      //”福建省(全部地区)-福建省(全部地区)”,
      “福州-福州”,
      “厦门-厦门”,
      “泉州-泉州”,
      “漳州-漳州”,
      “石狮-石狮”,
      “三明-三明”,
      “南平-南平”,
      “莆田-莆田”,
      “永安-永安”,
      “邵武-邵武”,
      “龙岩-龙岩”,
      “其他-其他”));

posted @ 2012-07-23 21:14  ``炯``  阅读(5003)  评论(0编辑  收藏  举报