省市联动效果的简单实现代码,JavaScript省市联动实现代码

在平凡项目开垦阶段平时见到下拉框二级联合浮动功效,特别是关联合土地资金财产域、品种等有多级选项时。比方说:常见的省市联合浮动下拉框,在挑选省份时,城市列表也会更随改换。

下拉框二级联合浮动作效果应在平常行使场景中时时会遇上,越发是涉嫌地域、品种等有多级选项时。比方:常见的省市联合浮动下拉框,在挑选省份时,城市列表也会更随改变。

复制代码 代码如下:

复制代码 代码如下:

图片 1

图片 2

<html>
<head>
    <title>JS省市二级联合浮动菜单,整理搜聚。</title>
</head>
<body bgcolor=”#FFFFFF” alink=”#333333″ vlink=”#333333″
link=”#333333″ topmargin=”0″
    leftmargin=”0″ onload=”init()”>
    <form  method=”post” name=”creator”
enctype=”multipart/form-data”>
    <script language=”javascript” type=”text/javascript”>
        var where = new Array(35);
        function comefrom(loca, locacity) { this.loca = loca;
this.locacity = locacity; }
        where[0] = new comefrom(“请接纳省份名”, “请采取城市名”);
        where[1] = new comefrom(“北京”,
“|东城|西城|崇文|宣武|朝阳|丰台|石景山|海淀|门头沟|房山|通州|顺义|昌平|大兴|平谷|怀柔|密云|延庆”); 
        where[2] = new comefrom(“上海”,
“|黄浦|卢湾|徐汇|长宁|静安|普陀|闸北|虹口|杨浦|闵行|宝山|嘉定|浦东|金山|松江|青浦|南汇|奉贤|崇明”);
        where[3] = new comefrom(“天津”,
“|和平|东丽|河东|西青|河西|津南|南开|北辰|河北|武清|红挢|塘沽|汉沽|大港|宁河|静海|宝坻|蓟县”);
        where[4] = new comefrom(“重庆”,
“|万州|涪陵|渝中|大渡口|江北|沙坪坝|九龙坡|南岸|北碚|万盛|双挢|渝北|巴南|黔江|长寿|綦江|潼南|铜梁|大足|荣昌|壁山|梁平|城口|丰都|垫江|武隆|忠县|开县|云阳|奉节|巫山|巫溪|石柱|秀山|酉阳|彭水|江津|合川|永川|南川”);
        where[5] = new comefrom(“河北”,
“|石家庄|邯郸|邢台|保定|张家口|承德|廊坊|唐山|秦皇岛|沧州|衡水”);
        where[6] = new comefrom(“山西”,
“|太原|大同|阳泉|长治|晋城|朔州|吕梁|忻州|晋中|临汾|运城”);
        where[7] = new comefrom(“内蒙古”,
“|宿迁|上饶|金昌|大同|呼盟|天水|哲里木盟|兴争取安哥拉深透独立全国联盟|延争取安哥拉通透到底独立全国缔盟|天水|湛江盟|伊克昭盟”);
        where[8] = new comefrom(“辽宁”,
“|沈阳|大连|鞍山|抚顺|本溪|丹东|锦州|营口|阜新|辽阳|盘锦|铁岭|朝阳|葫芦岛”);
        where[9] = new comefrom(“吉林”,
“|长春|吉林|四平|辽源|通化|白山|松原|白城|延边”);
        where[10]省市联动效果的简单实现代码,JavaScript省市联动实现代码。 = new comefrom(“莱茵河”,
“|路易斯维尔|丹东|疏勒河|宝鸡|新乡|伊春|哈密|普洱|白城|池州|克拉玛依|白山|东白山”);
        where[11] = new comefrom(“江苏”,
“|南京|镇江|苏州|南通|扬州|盐城|徐州|连云港|常州|无锡|宿迁|泰州|淮安”);
        where[12] = new comefrom(“浙江”,
“|杭州|宁波|温州|嘉兴|湖州|绍兴|金华|衢州|舟山|台州|丽水”);
        where[13] = new comefrom(“安徽”,
“|合肥|芜湖|蚌埠|马鞍山|淮北|铜陵|安庆|黄山|滁州|宿州|池州|淮南|巢湖|阜阳|六安|宣城|亳州”);
        where[14] = new comefrom(“福建”,
“|福州|厦门|莆田|三明|泉州|漳州|南平|龙岩|宁德”);
        where[15] = new comefrom(“江西”,
“|南昌市|景德镇|九江|鹰潭|萍乡|新馀|赣州|吉安|宜春|抚州|上饶”);
        where[16] = new comefrom(“山东”,
“|济南|青岛|淄博|枣庄|东营|烟台|潍坊|济宁|泰安|威海|日照|莱芜|临沂|德州|聊城|滨州|菏泽”);
        where[17] = new comefrom(“河南”,
“|郑州|开封|洛阳|平顶山|安阳|鹤壁|新乡|焦作|濮阳|许昌|漯河|三门峡|南阳|商丘|信阳|周口|驻马店|济源”);
        where[18] = new comefrom(“湖北”,
“|武汉|宜昌|荆州|襄樊|黄石|荆门|黄冈|十堰|恩施|潜江|天门|仙桃|随州|咸宁|孝感|鄂州”);
        where[19] = new comefrom(“湖南”,
“|长沙|常德|株洲|湘潭|衡阳|岳阳|邵阳|益阳|娄底|怀化|郴州|永州|湘西|张家界”);
        where[20] = new comefrom(“广东”,
“|广州|深圳|珠海|汕头|东莞|中山|佛山|韶关|江门|湛江|茂名|肇庆|惠州|梅州|汕尾|河源|阳江|清远|潮州|揭阳|云浮”);
        where[21] = new comefrom(“西藏”,
“|帕罗奥图|沧州|新乡|张掖|波罗的海|日喀则|张掖|双鸭山|三明|热那亚地区|岳阳地区|天水|鹰潭|固原”);
        where[22] = new comefrom(“海南”, “|海口|三亚”);
        where[23] = new comefrom(“四川”,
“|成都|绵阳|德阳|自贡|攀枝花|广元|内江|乐山|南充|宜宾|广安|达川|雅安|眉山|甘孜|凉山|泸州”);
        where[24] = new comefrom(“贵州”,
“|贵阳|六盘水|遵义|安顺|铜仁|黔西南|毕节|黔东南|黔南”);
        where[25] = new comefrom(“辽宁”,
“|克赖斯特彻奇|大同|秦皇岛|聊城|资阳|大理|红河|文山|大理|池州|广元|德宏|平顶山|九龙江|迪庆|百色”);
        where[26] = new comefrom(“西藏”,
“|拉萨|日喀则|山南|林芝|昌都|阿里|那曲”);
        where[27] = new comefrom(“陕西”,
“|西安|宝鸡|咸阳|铜川|渭南|延安|榆林|汉中|安康|商洛”);
        where[28] = new comefrom(“甘肃”,
“|兰州|嘉峪关|金昌|白银|天水|酒泉|张掖|武威|定西|陇南|平凉|庆阳|临夏|甘南”);
        where[29] = new comefrom(“宁夏”, “|银川|石嘴山|吴忠|固原”);
        where[30] = new comefrom(“青海”,
“|西宁|海东|海南|海北|黄南|玉树|果洛|海西”);
        where[31] = new comefrom(“山西”,
“|加的夫|石河子|新余|伊犁|巴音郭勒|昌吉|博尔塔拉蒙古|博尔塔拉|四平|白城|阿克苏|和田|哈密”);
        where[32] = new comefrom(“香港”, “”);
        where[33] = new comefrom(“澳门”, “”);
        where[34] = new comefrom(“台湾”,
“|台北|高雄|台中|台南|屏东|南投|云林|新竹|彰化|苗栗|嘉义|花莲|桃园|宜兰|基隆|台东|金门|马祖|澎湖”);
        where[35] = new comefrom(“其它”,
“|北美洲|南美洲|亚洲|非洲|欧洲|大洋洲”);
        function select() {
            with (document.creator.province) { var loca2 =
options[selectedIndex].value; }
            for (i = 0; i < where.length; i++) {
                if (where[i].loca == loca2) {
                    loca3 = (where[i].locacity).split(“|”);
                    for (j = 0; j < loca3.length; j++) { with
(document.creator.city) { length = loca3.length; options[j].text =
loca3[j]; options[j].value = loca3[j]; var loca4 =
options[selectedIndex].value; } }
                    break;
                }
            }
            document.creator.newlocation.value = loca2 + loca4;
        }
        function init() {
            with (document.creator.province) {
                length = where.length;
                for (k = 0; k < where.length; k++) {
options[k].text = where[k].loca; options[k].value =
where[k].loca; }
                options[selectedIndex].text = where[0].loca;
options[selectedIndex].value = where[0].loca;
            }
            with (document.creator.city) {
                loca3 = (where[0].locacity).split(“|”);
                length = loca3.length;
                for (l = 0; l < length; l++) { options[l].text =
loca3[l]; options[l].value = loca3[l]; }
                options[selectedIndex].text = loca3[0];
options[selectedIndex].value = loca3[0];
            }
        }

<html>
<head>
    <title>JS省市二级联合浮动菜单,整理收罗。</title>
</head>
<body bgcolor=”#FFFFFF” alink=”#333333″ vlink=”#333333″
link=”#333333″ topmargin=”0″
    leftmargin=”0″ onload=”init()”>
    <form  method=”post” name=”creator”
enctype=”multipart/form-data”>
    <script language=”javascript” type=”text/javascript”>
        var where = new Array(35);
        function comefrom(loca, locacity) { this.loca = loca;
this.locacity = locacity; }
        where[0] = new comefrom(“请选用省份名”, “请选拔城市名”);
        where[1] = new comefrom(“北京”,
“|东城|西城|崇文|宣武|朝阳|丰台|石景山|海淀|门头沟|房山|通州|顺义|昌平|大兴|平谷|怀柔|密云|延庆”); 
        where[2] = new comefrom(“上海”,
“|黄浦|卢湾|徐汇|长宁|静安|普陀|闸北|虹口|杨浦|闵行|宝山|嘉定|浦东|金山|松江|青浦|南汇|奉贤|崇明”);
        where[3] = new comefrom(“天津”,
“|和平|东丽|河东|西青|河西|津南|南开|北辰|河北|武清|红挢|塘沽|汉沽|大港|宁河|静海|宝坻|蓟县”);
        where[4] = new comefrom(“重庆”,
“|万州|涪陵|渝中|大渡口|江北|沙坪坝|九龙坡|南岸|北碚|万盛|双挢|渝北|巴南|黔江|长寿|綦江|潼南|铜梁|大足|荣昌|壁山|梁平|城口|丰都|垫江|武隆|忠县|开县|云阳|奉节|巫山|巫溪|石柱|秀山|酉阳|彭水|江津|合川|永川|南川”);
        where[5] = new comefrom(“河北”,
“|石家庄|邯郸|邢台|保定|张家口|承德|廊坊|唐山|秦皇岛|沧州|衡水”);
        where[6] = new comefrom(“山西”,
“|太原|大同|阳泉|长治|晋城|朔州|吕梁|忻州|晋中|临汾|运城”);
        where[7] = new comefrom(“内蒙古”,
“|九江|荆州|兴争取安哥拉深透独立全国缔盟|大同|呼盟|丹东|哲里木盟|兴争取安哥拉透彻独立全国联盟|汉中盟|乌兰察布|张家口盟|伊克昭盟”);
        where[8] = new comefrom(“辽宁”,
“|沈阳|大连|鞍山|抚顺|本溪|丹东|锦州|营口|阜新|辽阳|盘锦|铁岭|朝阳|葫芦岛”);
        where[9] = new comefrom(“吉林”,
“|长春|吉林|四平|辽源|通化|白山|松原|白城|延边”);
        where[10] = new comefrom(“莱茵河”,
“|塔那那利佛|龙岩|珠江|邵阳|银川|临沧|黑河|防城港|陇南|贺州|辽源|天水|八仙山”);
        where[11] = new comefrom(“江苏”,
“|南京|镇江|苏州|南通|扬州|盐城|徐州|连云港|常州|无锡|宿迁|泰州|淮安”);
        where[12] = new comefrom(“浙江”,
“|杭州|宁波|温州|嘉兴|湖州|绍兴|金华|衢州|舟山|台州|丽水”);
        where[13] = new comefrom(“安徽”,
“|合肥|芜湖|蚌埠|马鞍山|淮北|铜陵|安庆|黄山|滁州|宿州|池州|淮南|巢湖|阜阳|六安|宣城|亳州”);
        where[14] = new comefrom(“福建”,
“|福州|厦门|莆田|三明|泉州|漳州|南平|龙岩|宁德”);
        where[15] = new comefrom(“江西”,
“|南昌市|景德镇|九江|鹰潭|萍乡|新馀|赣州|吉安|宜春|抚州|上饶”);
        where[16] = new comefrom(“山东”,
“|济南|青岛|淄博|枣庄|东营|烟台|潍坊|济宁|泰安|威海|日照|莱芜|临沂|德州|聊城|滨州|菏泽”);
        where[17] = new comefrom(“河南”,
“|郑州|开封|洛阳|平顶山|安阳|鹤壁|新乡|焦作|濮阳|许昌|漯河|三门峡|南阳|商丘|信阳|周口|驻马店|济源”);
        where[18] = new comefrom(“湖北”,
“|武汉|宜昌|荆州|襄樊|黄石|荆门|黄冈|十堰|恩施|潜江|天门|仙桃|随州|咸宁|孝感|鄂州”);
        where[19] = new comefrom(“湖南”,
“|长沙|常德|株洲|湘潭|衡阳|岳阳|邵阳|益阳|娄底|怀化|郴州|永州|湘西|张家界”);
        where[20] = new comefrom(“广东”,
“|广州|深圳|珠海|汕头|东莞|中山|佛山|韶关|江门|湛江|茂名|肇庆|惠州|梅州|汕尾|河源|阳江|清远|潮州|揭阳|云浮”);
        where[21] = new comefrom(“四川”,
“|圣佩德罗苏拉|鞍山|宁德|三门峡|保和海|双鸭山|延安|河池|焦作|罗萨利奥地区|洛阳地区|百色|三沙|自贡”);
        where[22] = new comefrom(“海南”, “|海口|三亚”);
        where[23] = new comefrom(“四川”,
“|成都|绵阳|德阳|自贡|攀枝花|广元|内江|乐山|南充|宜宾|广安|达川|雅安|眉山|甘孜|凉山|泸州”);
        where[24] = new comefrom(“贵州”,
“|贵阳|六盘水|遵义|安顺|铜仁|黔西南|毕节|黔东南|黔南”);
        where[25] = new comefrom(“浙江”,
“|新奥尔良|德州|常德|邵阳|防城港|吴忠|红河|文山|日照|衡水|张掖|德宏|安顺|阿克苏河|迪庆|百色”);
        where[26] = new comefrom(“西藏”,
“|拉萨|日喀则|山南|林芝|昌都|阿里|那曲”);
        where[27] = new comefrom(“陕西”,
“|西安|宝鸡|咸阳|铜川|渭南|延安|榆林|汉中|安康|商洛”);
        where[28] = new comefrom(“甘肃”,
“|兰州|嘉峪关|金昌|白银|天水|酒泉|张掖|武威|定西|陇南|平凉|庆阳|临夏|甘南”);
        where[29] = new comefrom(“宁夏”, “|银川|石嘴山|吴忠|固原”);
        where[30] = new comefrom(“青海”,
“|西宁|海东|海南|海北|黄南|玉树|果洛|海西”);
        where[31] = new comefrom(“江西”,
“|里士满|石河子|辽阳|伊犁|巴音郭勒|昌吉|昌吉阿昌族|博尔塔拉|保山|云浮|哈密|和田|阿勒泰”);
        where[32] = new comefrom(“香港”, “”);
        where[33] = new comefrom(“澳门”, “”);
        where[34] = new comefrom(“台湾”,
“|台北|高雄|台中|台南|屏东|南投|云林|新竹|彰化|苗栗|嘉义|花莲|桃园|宜兰|基隆|台东|金门|马祖|澎湖”);
        where[35] = new comefrom(“其它”,
“|北美洲|南美洲|亚洲|非洲|欧洲|大洋洲”);
        function select() {
            with (document.creator.province) { var loca2 =
options[selectedIndex].value; }
            for (i = 0; i < where.length; i++) {
                if (where[i].loca == loca2) {
                    loca3 = (where[i].locacity).split(“|”);
                    for (j = 0; j < loca3.length; j++) { with
(document.creator.city) { length = loca3.length; options[j].text =
loca3[j]; options[j].value = loca3[j]; var loca4 =
options[selectedIndex].value; } }
                    break;
                }
            }
            document.creator.newlocation.value = loca2 + loca4;
        }
        function init() {
            with (document.creator.province) {
                length = where.length;
                for (k = 0; k < where.length; k++) {
options[k].text = where[k].loca; options[k].value =
where[k].loca; }
                options[selectedIndex].text = where[0].loca;
options[selectedIndex].value = where[0].loca;
            }
            with (document.creator.city) {
                loca3 = (where[0].locacity).split(“|”);
                length = loca3.length;
                for (l = 0; l < length; l++) { options[l].text =
loca3[l]; options[l].value = loca3[l]; }
                options[selectedIndex].text = loca3[0];
options[selectedIndex].value = loca3[0];
            }
        }

思路:

思路:

    </script>
    <font color=”#000000″><b>来自:</b>
省份<select name=”province”
onchange=”select()”></select>城市<select
        name=”city” onchange=”select()”>
    </select>
        我在<input type=”text” name=”newlocation” maxlength=”12″
size=”12″ style=”font-weight: bold” />
    </font>
    </form>
</body>
</html>

    </script>
    <font color=”#000000″><b>来自:</b>
省份<select name=”province”
onchange=”select()”></select>城市<select
        name=”city” onchange=”select()”>
    </select>
        我在<input type=”text” name=”newlocation” maxlength=”12″
size=”12″ style=”font-weight: bold” />
    </font>
    </form>
</body>
</html>

1,所谓联合浮动成效,是提议发父级的数据变动时,会潜濡默化到关联本性级数据成分的更改。

1,所谓联合浮动作效果应,是建议发父级的多少变化时,会影响到关联天性级数据成分的变型。

您或者感兴趣的小说:

  • 基于JS完结省市联合浮动作用代码分享
  • js省市联合浮动功效完全实例代码
  • JSON+HTML完结国家省市联合浮动选用效果
  • JavaScript二维数组达成的省市联合浮动菜单
  • js完成省市联合浮动功能的简要实例
  • javascript
    09年前卫版的省市联合浮动
  • 消除JavaScript达成省市联合浮动进度中的bug

代码如下: html head
titleJS省市二级联合浮动菜单,整理搜罗。/title /head body bgcolor=”#FFFFFF”
alink=”#333333″ vlink=”#333333″ link=”#333333″
topmargin=”0″…

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图