zoukankan      html  css  js  c++  java
  • 级联菜单

    第一种case判断省份,添加

    html:

    <body>
    <form action="" method="post" name="myForm">
    <select id="selProvince" onchange="changeCity()">
    <option>--选择省份--</option>
    <option value="河南省">河南省</option>
    <option value="河北省">河北省</option>
    <option value="山东省">山东省</option>
    <option value="四川省">四川省</option>
    </select>
    <select id="selCity">
    <option>--选择城市--</option>
    </select>
    </form>
    </body>

    script:

    function changeCity(){
    var province=document.getElementById("selProvince").value;
    var city=document.getElementById("selCity");
    city.options.length=0;
    switch(province){
    case "河南省":
    city.add(new Option("郑州市","郑州市"),null);
    city.add(new Option("洛阳市","洛阳市"),null);
    break;
    case "河北省":
    city.add(new Option("邯郸","邯郸市"),null);
    city.add(new Option("石家庄","石家庄"),null);
    break;
    case "山东省":
    city.add(new Option("青岛市","青岛市"),null);
    city.add(new Option("烟台市","烟台市"),null);
    break;
    case "四川省":
    city.add(new Option("成都市","成都市"),null);
    city.add(new Option("乐山市","乐山市"),null);
    break;
    }
    }

    第二种方法,更优化的写法;

    <form>
    <tr>
    <td class="left">现居住地:</td>
    <td> <select id="selProvince" onchange="changeCity( )" style="100px">
    <option>--选择省份--</option>
    </select>
    <select id="selCity" style="100px">
    <option>--选择城市--</option></select></td>
    </tr>
    </form>

    script:
    <script type="text/javascript">
    var cityList=new Array();
    cityList['北京市']=['北京市','朝阳区','海淀区'];
    cityList['四川省']=['成都市','攀枝花','乐山市'];
    cityList['广东省']=['东莞市','广州','茂名市'];
    function changeCity() {
    var selProvince=document.getElementById('selProvince').value;
    var selCity=document.getElementById('selCity');
    selCity.options.length=0;
    //遍历数组
    for(var i in cityList){
    if(i==selProvince){
    //遍历数组中的值,添加给城市数组中
    for(var j in cityList[i]){
    selCity.add(new Option(cityList[i][j],cityList[i][j],null))
    }

    }
    }

    }
    function allCity(){
    var province=document.getElementById('selProvince');
    for(var i in cityList){
    province.add(new Option(i,i),null);
    }
    }
    window.onload=allCity;
    </script>

  • 相关阅读:
    函数的命名空间和作用域
    python 各个地方导航(方便查询,持续更新!)
    零基础学虚幻4(UE4):蓝图+VR 丁树凯教程
    UE4打包后的游戏,无法打卡其他关卡的解决办法
    【精辟】进制转换
    Git仓库的初始化
    【编程】杂碎知识点
    MFC制作带界面的DLL库
    StartImage.DLL使用说明
    MFC对话框程序:实现程序启动画面
  • 原文地址:https://www.cnblogs.com/lwj820876312/p/7364029.html
Copyright © 2011-2022 走看看