zoukankan      html  css  js  c++  java
  • 复选下拉菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style type="text/css">
    #selectCity
    {
    height: 28px;
    172px;
    }
    #selectArea
    {
    height: 28px;
    167px;
    }
    </style>
    <script language="javascript" type="text/javascript">
    function selectValue() {
    var s = document.getElementById("selectCity");
    var selectValue = s.options[s.selectedIndex].value;
    var aarea;
    switch (selectValue) {
    case "成都":
    sarea = new Array("锦江区", "青羊区", "金牛区", "武侯区", "成华区", "高新区");
    break;
    case "重庆":
    sarea = new Array("渝中区", "沙坪坝", "渝北区", "九龙坡区", "大渡口区", "巴南区");
    break;
    default:
    break;
    }
    var areaDom = document.getElementById("selectArea");
    if (selectValue != "0") {


    areaDom.options.length = 0;
    for (var i = 0; i < sarea.length; i++) {
    var domoption = document.createElement("option");
    var domtext = document.createTextNode(sarea[i]);
    domoption.appendChild(domtext);
    areaDom.appendChild(domoption);
    }
    }
    else {
    if (areaDom.options[0].value != "1") {
    areaDom.options.length = 0;
    var a = document.createElement("option");
    var atext = document.createTextNode("--请选择所在的地区--");
    a.setAttribute("value", "1");
    a.appendChild(atext);
    areaDom.appendChild(a);
    }
    }
    }
    </script>
    </head>
    <body>
    请选择你在的城市:<select id="selectCity" onchange="selectValue();">
    <option value="0">--请选择所在的城市--</option>
    <option value="成都">成都</option>
    <option value="重庆">重庆</option>
    </select>
    所在的地区:<select id="selectArea">
    <option value="1">--请选择所在的地区--</option>
    </select>
    </body>
    </html>

  • 相关阅读:
    Hadoop HDFS的Shell操作实例
    我来阿里的2年
    设计模式之迪米特原则(LoD)
    设计模式之接口隔离原则
    设计模式之依赖倒置原则
    设计模式之里氏替换原则(LSP)
    设计模式之单一职责原则(SRP)
    Android开发系列之性能优化
    Android开发系列之屏幕密度和单位转换
    Android开发系列之ListView
  • 原文地址:https://www.cnblogs.com/tutuwowo/p/5725475.html
Copyright © 2011-2022 走看看