js实现二级联动

来源：互联网发布：java md5解密密码编辑：程序博客网时间：2024/05/14 20:30
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>jstest2</title><script type="text/javascript">    window.onload = function() {        var ele1 = document.getElementById("provice");        ele1.onchange = function() {            var city = document.getElementById("city");            var cityoptins = city.getElementsByTagName("option");            for (var i = 1; i < cityoptins.length; i++) {                city.removeChild(cityoptins[i]);                i--;            }            city.childNodes = "";            var provice = this.value;            if (provice == "") {                return;            }            var arr = [ [ "山西省", "忻州", "太原", "吕梁" ],                    [ "山东省", "青岛", "烟台", "潍坊" ], [ "河北省", "秦皇岛", "石家庄", "张家口" ] ];            for (var i = 0; i < arr.length; i++) {                for (var j = 1; j < arr[i].length; j++) {                    if (provice == arr[i][0]) {                        var cityText = arr[i][j];                        var cityTextNode = document.createTextNode(cityText);                        var optionNode = document.createElement("option");                        optionNode.appendChild(cityTextNode);                        city.appendChild(optionNode);                    }                }            }        }    }</script></head><body>    内容介绍：在第一个下拉列表选择省份，点击第二个列表出现对应省份的城市    <br />    <select id="provice">        <option>请选择。。</option>        <option value="山西省">山西省</option>        <option value="山东省">山东省</option>        <option value="河北省">河北省</option>    </select>    <select id="city">        <option>请选择。。</option>    </select></body></html>
阅读全文
1 0