<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <!--/*switch(ind){ case 1: var op1=new Option("长沙市"); document.getElementById("selCity").options.add(op1); break; case 2: var op1=new Option("武汉"); document.getElementById("selCity").options.add(op1); break; case 3: var op1=new Option("广州"); document.getElementById("selCity").options.add(op1); break; }*/--> <script> function loadCity() { var citylist = []; citylist["湖南省"] = ["长沙", "株州市", "湘潭市"]; citylist["湖北省"] = ["武汉", "黄冈", "恩施"]; citylist["广东省"] = ["广州", "佛山", "堔圳"]; var prov = document.getElementById("selProv").value; document.getElementById("selCity").options.length = 1; //遍历数组时,以变量prov为索引 for(var i in citylist[prov]) { /*新建一个节点,并把对应的值放到option节点中去*/ var op = new Option(citylist[prov][i]); /*将op添加到select的节点中去*/ document.getElementById("selCity").options.add(op); } } </script> </head> <body> <div> <p>省份: <select id="selProv" onchange="loadCity()"> <option>--请选择--</option> <option>湖南省</option> <option>湖北省</option> <option>广东省</option> </select> <p>城市: <select id="selCity"> <option>--请选择--</option> </select> </p> </div> </body> </html>
javascript二级联动校果实现
猜你喜欢
转载自blog.csdn.net/lzpzwy/article/details/80072802
今日推荐
周排行