js省市联动(适合小白)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript">
        var shengarr = ["湖北省", "湖南省", "广东省"];
        var city = [["武汉", "荆州", "仙桃", "恩施"], ["长沙", "湘潭", "岳阳", "韶山"], ["东莞", "广州", "佛山", "汕头"]];
        window.onload=function insertfun() {
            var vsheng = document.getElementById("sheng");
            for (var i = 0; i < shengarr.length; i++) {
                var opp = document.createElement("option");
                opp.innerHTML = shengarr[i];
                opp.value = i; 
                vsheng.appendChild(opp);
            }
            insertcityfun();
        }
        function insertcityfun() {
            var id = document.getElementById("sheng").value;
            var vshi = document.getElementById("shi");
            vshi.options.length = 0;
            var cityarr = city[parseInt(id)];
            for (var i = 0; i < cityarr.length; i++) {
                var cpp = document.createElement("option");
                cpp.innerHTML = cityarr[i];
                cpp.value = i;
                vshi.appendChild(cpp);
            }
        }
    </script>
</head>
<body>
    <!--省市联动-->
    <select id="sheng" onchange="insertcityfun()">
    </select>
    <select id="shi"></select>
</body>
</html>
js省市联动(适合小白)

猜你喜欢
