• JavaScript 实现N级联动的下拉列表


    <form name="form1" method="post">
    <select id="s1" name="s1"></select><select id="s2" name="s2"></select><select id="s3" name="s3"></select><select id="s4" name="s4"></select>
    </form>
    <script language="JavaScript">
    <!--
    function LianDong(arr, sel)
    {
     var me = this;
     this.$ = function(o)
     {
      return document.getElementById(o);
     }

     this.sub = function (i, pid)
     {
      for (var j=i+1; j<sel.length; j++)
      {
       me.$(sel[j]).length = 0;
       me.$(sel[j]).options[0] = new Option("请选择", "");
      }
      for ( var j = 0; j < arr.length; j++)
      {
       if (arr[j][1] == pid)
       {
        me.$(sel[i+1]).options[me.$(sel[i+1]).length] = new Option(arr[j][2], arr[j][0]);
       }
      }
     }

     this.init = function()
     {
      me.sub(-1,"root");
      for (var i=0; i<sel.length-1; i++)
      {
       me.$(sel[i]).onchange = function()
       {
        var i;
        for (i=0; me.$(sel[i])!=this; i++);
        me.sub(i, me.$(sel[i]).value);
       }
      }
     }

     this.init();
    }

    var array=new Array();
    array[0]=new Array("华南地区","root","华南地区");
    array[1]=new Array("华北地区","root","华北地区");
    array[2]=new Array("上海","华南地区","上海");
    array[3]=new Array("广东","华南地区","广东");
    array[4]=new Array("徐家汇","上海","徐家汇");
    array[5]=new Array("普托","上海","普托");
    array[6]=new Array("广州","广东","广州");
    array[7]=new Array("湛江","广东","湛江");
    array[8]=new Array("湛江1","湛江","湛江1");
    array[9]=new Array("湛江2","湛江","湛江2");
    array[10]=new Array("广州1","广州","广州1");
    array[11]=new Array("广州2","广州","广州2");

    var select = new Array("s1","s2","s3","s4");

    var liandong=new LianDong(array, select)
    //-->
    </script>

  • 相关阅读:
    xdvipdfmx:fatal: Unable to open "xxx.pdf". Output file removed. fwrite: Broken pipe xelatex.exe
    安装Visual Studio 时窗口闪过就退出
    一些概念的收集
    如何让字符串中奇怪的空格现出原形
    mysql替换特殊字符
    asscii码对应表
    Linux下的tar压缩解压缩命令详解
    centos 6.8 /etc/sysconfig/下没有iptables的问题
    mysqldumpslow简单用法
    linux查询占用空间较大的文件
  • 原文地址:https://www.cnblogs.com/wzg0319/p/2028993.html
Copyright © 2020-2023  润新知