select下拉框多级联动

原创 2007年10月01日 17:52:00
<!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>  
  
<meta   http-equiv="Content-Type"   content="text/html;   charset=gb2312"   />  
  
<title></title>  
  
</head>  
   
  
<body>  
   
  
<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.SetValue   =   function()  
    
...{  
      
for   (var   i=0;   i<arguments.length-1;   i++)  
      
...{  
        me.$(sel[i]).value   
=   arguments[i];  
        me.sub(i,   me.$(sel[i]).value);  
      }
  
      me.$(sel[arguments.length
-1]).value   =   arguments[arguments.length-1];  
    }
  
   
    
this.init();  
  }
  
   
  
var   array=new   Array();  
  array[
0]=new   Array("1","root","华南地区");  
  array[
1]=new   Array("2","root","华北地区");  
  array[
2]=new   Array("3","1","上海");  
  array[
3]=new   Array("4","1","广东");  
  array[
4]=new   Array("5","上海","徐家汇");  
  array[
5]=new   Array("6","3","普托");  
  array[
6]=new   Array("7","4","广州");  
  array[
7]=new   Array("8","4","湛江");  
  array[
8]=new   Array("9","8","湛江1");  
  array[
9]=new   Array("10","8","湛江2");  
  array[
10]=new   Array("11","7","广州1");  
  array[
11]=new   Array("12","7","广州2");  
   
  
var   select   =   new   Array("s1","s2","s3","s4");  
   
  
var   liandong=new   LianDong(array,   select)  
   
  liandong.SetValue(
'华南地区','广东','广州','广州1');  
  
//-->  
  
</script>  
   
  
</body>  
  
</html>
 

Jquery实现下拉框、多级联动

  • 2017年11月08日 20:14
  • 393KB
  • 下载

jQuery ajax 多级联动 下拉框 Demo

  • 2015年08月06日 15:07
  • 310KB
  • 下载

extjs 下拉框 多级联动

extjs 下拉框 多级联动

书籍:超实用的javascript代码段:下拉框二级联动效果(解析笔记)附带后台循环查询多级分类下的原理

之前做的一段每行解析,重要的是带来的思路原理 下拉聯動 省 市 var linkDatas = { provinces:[ ...

JS特效-N级的联动Select下拉框

  • 2010年01月07日 10:52
  • 2KB
  • 下载

动态联动select下拉框实现

我们在做下拉框选择时,常常会遇到一种场景,就是需要两个下拉框,其中一个下拉框的选项和内容需要根据第一个的下拉框的选择动态变化。比如我有大的分类:有氧运动  无氧运动选择有氧运动时,选项有:跑步,游泳选...

mvc中大类和小类二级联动下拉框使用 select2 插件的初始加载方法

cshtml页面中的html代码: 类别 大类: ...
  • sxf359
  • sxf359
  • 2017年07月14日 15:26
  • 422

js实现下拉框联动选中日期(select 日期联动更改)

html代码
  • zh921112
  • zh921112
  • 2014年08月05日 18:17
  • 12141

如何通过jQuery实现select下拉框的联动效果

由于项目需要,小编需要实现三个HTML的select下拉框联动的效果,如果考虑到实际用户体验的话,直接用异步刷新的方式操作DOM是最好的选择,这里小编直接使用了jQuery作为DOM操作的工具,直接操...
  • tr1912
  • tr1912
  • 2017年12月10日 21:39
  • 30
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:select下拉框多级联动
举报原因:
原因补充:

(最多只允许输入30个字)