zoukankan      html  css  js  c++  java
  • js二级联动

    html页面代码

    <select id="tableType" name="tableType" class="select" onchange="changeSelect(this.selectedIndex)" style="100%;color:#3C3C3C;">
                                        <option value="0" selected>投诉</option>
                                        <option value="1">意见</option>
                                        <option value="2">举报</option>
                                        <option value="3">故障报修</option>
                                        <option value="4">服务申请</option>
                                        <option value="5">表扬</option>
                                        <option value="6">建议</option>
                                        <option value="7">业务咨询</option>
                                    </select>
    <select id="addTable" name="addTable" style="100%;color:#3C3C3C;" >
                                    </select>

    js代码

    <script language="JavaScript" type="text/javascript">
    /* 二级联动下拉列表 */
         var selectArray = [
                         //所有的
                         //["1","各单位各类数及总数","2","各类占比","3","同比","4","环比","5","各单位工单件数及占工单总数比例","6","本月属实、不属实工单件数及占工单总数比例","7","不同子类型工单件数","8","故障各类型件数占故障工单总数比例"],
                         
                         //投诉
                         ["1","各单位各类数及总数","2","各类占比","3","同比","4","环比","5","各单位工单件数及占工单总数比例","6","本月属实、不属实工单件数及占工单总数比例","7","不同子类型工单件数","9","本月各分公司按一级分类、二级分类、三级分类统计件数","10","本月营销类投诉、生产类投诉件数及占投诉总数比例","11","本月一类投诉件数占投诉总数比例、二类投诉件数占投诉总数比例"],
                         
                         //意见
                         ["1","各单位各类数及总数","2","各类占比","3","同比","4","环比","5","各单位工单件数及占工单总数比例","7","不同子类型工单件数"],
                         
                         //举报
                         ["1","各单位各类数及总数","2","各类占比","3","同比","4","环比","5","各单位工单件数及占工单总数比例","6","本月属实、不属实工单件数及占工单总数比例","7","不同子类型工单件数"],
                         
                         //故障
                         ["1","各单位各类数及总数","2","各类占比","3","同比","4","环比","5","各单位工单件数及占工单总数比例","7","不同子类型工单件数","8","故障各类型件数占故障工单总数比例"],
                         
                         //服务申请、建议、咨询业务、表扬
                         ["1","各单位各类数及总数","2","各类占比","3","同比","4","环比","5","各单位工单件数及占工单总数比例"]
                     ];
          //初始化下拉列表
         function initSelect(){
             changeSelect(0);
         }
         function  changeSelect(index){
             switch(index){
                 case 0: break;
                 case 1: break;
                 case 2: break;
                 case 3: break;
                 case 4: break;
                 case 5: index=4;
                 case 6: index=4;
                 case 7: index=4;
             }
            //选择对象
             var tableSelect1 = document.getElementById("tableType");
             var tableSelect2 = document.getElementById("addTable");
                tableSelect1.selectedIndex = index;
            //指定tableSelect2中<option>标记的个数
            tableSelect2.length = selectArray[index].length / 2;
             //循环将数组中的数据写入<option>标记中
            for (var i = 0;i<tableSelect2.length;i++) {
                //tableSelect2.option[i] = new Option();
                //tableSelect2.option[i].text = selectArray[index][2*i+1];
                //tableSelect2.option[i].value = selectArray[index][2*i];
                tableSelect2[i]=new Option(selectArray[index][2*i+1],selectArray[index][2*i]);
            }
        }
    </script>
    如有疑问,欢迎留言讨论。
  • 相关阅读:
    js setTimeout深度递归后完成回调
    [Err]1267
    YII数据库操作中打印sql
    Creating a web server in pure C(c/c++ 写web server)
    lighttpd 介绍及安装
    HDU 1003 Max Sum
    2014-8-10 掉落不简单
    最全SpringMVC具体演示样例实战教程
    Android 之 资源文件的介绍及使用
    我的创业劲儿,无可阻挡-JAVA学院张孝伟
  • 原文地址:https://www.cnblogs.com/zhhy/p/10279046.html
Copyright © 2011-2022 走看看