二级联动——福州区县

js

var cityOp = new cityList();
var quOp = new quList();

function cityList() {
    this.length = 6;
    this[0] = new Option("请选择所在的地市", "");
    this[1] = new Option("福州市", "福州市");
    this[2] = new Option("宁德市", "宁德市");
    this[3] = new Option("南平市", "南平市");
    this[4] = new Option("三明市", "三明市");
    this[5] = new Option("莆田市", "莆田市");
    return this;
}

function quList() {
    this.length = 6;
    this[0] = new Array(1);
    this[0][0] = new Option("请选择所在的区县", "");
    // 福州
    this[1] = new Array(2);
    this[1][0] = new Option("福州市", "福州市");
    this[1][1] = new Option("闽侯县", "闽侯县");
    this[1][2] = new Option("闽清县", "闽清县");
    this[1][3] = new Option("永泰县", "永泰县");
    this[1][4] = new Option("罗源县", "罗源县");
    this[1][5] = new Option("连江县", "连江县");
    this[1][6] = new Option("鼓楼区", "鼓楼区");
    this[1][7] = new Option("台江区", "台江区");
    this[1][8] = new Option("仓山区", "仓山区");
    this[1][9] = new Option("晋安区", "晋安区");
    this[1][10] = new Option("马尾区", "马尾区");
    this[1][11] = new Option("福清市", "福清市");
    this[1][12] = new Option("长乐市", "长乐市");
// 宁德
    this[2] = new Array(1);
    this[2][0] = new Option("蕉城区", "蕉城区");
    this[2][1] = new Option("福安市", "福安市");
    this[2][2] = new Option("福鼎市", "福鼎市");
    this[2][3] = new Option("寿宁县", "寿宁县");
    this[2][4] = new Option("霞浦县", "霞浦县");
    this[2][5] = new Option("柘荣县", "柘荣县");
    this[2][6] = new Option("屏南县", "屏南县");
    this[2][7] = new Option("古田县", "古田县");
    this[2][8] = new Option("周宁县", "周宁县");
    // 南平
    this[3] = new Array(4);
    this[3][0] = new Option("邵武市", "邵武市");
    this[3][1] = new Option("武夷山", "武夷山");
    this[3][2] = new Option("建瓯市", "建瓯市");
    this[3][3] = new Option("建阳市", "建阳市");
    this[3][4] = new Option("延平区", "延平区");
    this[3][5] = new Option("顺昌县", "顺昌县");
    this[3][6] = new Option("蒲城县", "蒲城县");
    this[3][7] = new Option("光泽县", "光泽县");
    this[3][8] = new Option("松溪县", "松溪县");
    this[3][9] = new Option("政和县", "政和县");
    // 三明
    this[4] = new Array(9);
    this[4][0] = new Option("沙县", "沙县");
    this[4][1] = new Option("尤溪县", "尤溪县");
    this[4][2] = new Option("大田县", "大田县");
    this[4][3] = new Option("明溪县", "明溪县");
    this[4][4] = new Option("清流县", "清流县");
    this[4][5] = new Option("宁化县", "宁化县");
    this[4][6] = new Option("将乐县", "将乐县");
    this[4][7] = new Option("泰宁县", "泰宁县");
    this[4][8] = new Option("建宁县", "建宁县");
    // 莆田
    this[5] = new Array(14);
    this[5][0] = new Option("城厢区", "城厢区");
    this[5][1] = new Option("涵江区", "涵江区");
    this[5][2] = new Option("荔城区", "荔城区");
    this[5][3] = new Option("秀屿区", "秀屿区");
    this[5][4] = new Option("仙游县", "仙游县");


    return this;
}



function delCity(qu) {
    var len = qu.length;
    for (i = 0; i < len; i++) {
        qu.remove(0);
    }
}

function addCity(cityv, qu) {
    var index = cityv.selectedIndex;
    //alert(index);
    for (j = 0; j < quOp[index].length; j++) {
        qu.options.add(quOp[index][j]);
    }
}

function changeCity(cityObj, quObj) {
    delCity(quObj);
    addCity(cityObj, quObj);
    //alert("省份：" + cityObj.value + "\t城市：" + quObj.value);
}

function initialize(cityObj, quObj, cityID, quID) {
    // 初始化列表
    for (i = 0; i < cityOp.length; i++) {
        cityObj.options.add(cityOp[i]);
    }
    for (j = 0; j < cityObj.options.length; j++) {
        if (cityObj.options[j].value == cityID) {
            cityObj.options[j].selected = true;
        }
    }
    addCity(cityObj, quObj);
    for (k = 0; k < quObj.options.length; k++) {
        if (quObj.options[k].value == quID) {
            quObj.options[k].value = true;
        }
    }
}

 html

 <select dataType="Require" msg="请选择所在地市" id="city" name="city"
                        onchange="changeCity(document.getElementById('city'),document.getElementById('qu'));"></select>
                    <select id="qu" name='Ext1' msg="请选择所在区县"></select>

标签：Option,cityObj,quObj,福州,length,区县,联动,new,options
来源： https://www.cnblogs.com/tangsujuan/p/14204976.html