.net和javascript 结合 ,生成三级联动无刷新下拉菜单【修改版】2

ClassChange.js 

function  CreateRootID(targForm){ // 生成省级分类 targForm为目标表单
     var  parent = targForm.NationID;
     var  subfield = targForm.RootID;
     var  classid;
     if (parent.length > 0 )
    classid = parent.options[parent.selectedIndex].value
     else
    classid = parent.value;
    subfield.length  =   0 ;
    subfield.options[subfield.length]  =   new  Option('选择省份',' 0 ');
     for  (i = 0 ; i  <  province.length; i ++ ){
         if  (Root[i][ 0 ]  ==  classid){
            subfield.options[subfield.length]  =   new  Option(Root[i][ 2 ], Root[i][ 1 ]);
        }
    }
}

function  CreateClassID(targForm){ // 生成市级分类
     var  subfield = targForm.ClassID;
     var  classid = targForm.RootID.options[targForm.RootID.selectedIndex].value;
    subfield.length  =   0 ;
    subfield.options[subfield.length]  =   new  Option('选择城市',' 0 ');
     for  (i = 0 ; i  <  Class.length; i ++ ){
         if  (Class[i][ 0 ]  ==  classid){
            subfield.options[subfield.length]  =   new  Option(Class[i][ 2 ], Class[i][ 1 ]);
        }
    }
}

function  CreateKindID(targForm){ // 生成区县级分类
     var  subfield = targForm.KindID;
     var  classid = targForm.ClassID.options[targForm.ClassID.selectedIndex].value;
    subfield.length  =   0 ;
    subfield.options[subfield.length]  =   new  Option('选择区县',' 0 ');
     for  (i = 0 ; i  <  Kind.length; i ++ ){
         if  (Kind[i][ 0 ]  ==  classid){
            subfield.options[subfield.length]  =   new  Option(Kind[i][ 2 ], Kind[i][ 1 ]);
        }
    }
}

classFunction.js

//  JScript 文件
function  CreateRootID(targForm,sType){ // 生成一级分类 targForm为目标表单
     var  targ = targForm.RootID;
    targ.length  =   0 ;
    targ.options[targ.length]  =   new  Option('一级分类','');
     for (i = 0 ; i < province.length; i ++ ){
        
            targ.options[targ.length]  =   new  Option(province[i][ 2 ], province[i][ 1 ]);
       
    }
}

function  CreateClassID(targForm){ // 生成二级分类 targForm为目标表单
     var  parent = targForm.RootID;
     var  subfield = targForm.ClassID;
     var  classid;
    classid = parent.options[parent.selectedIndex].value;
    subfield.length  =   0 ;
    subfield.options[subfield.length]  =   new  Option('二级分类','');
     for  (i = 0 ; i  <  city.length; i ++ ){
         if  (city[i][ 0 ]  ==  classid){
            subfield.options[subfield.length]  =   new  Option(city[i][ 2 ], city[i][ 1 ]);
        }
    }
}
function  CreateKindID(targForm){ // 生成三级分类 targForm为目标表单
     var  parent = targForm.ClassID;
     var  subfield = targForm.KindID;
     var  classid;
    classid = parent.options[parent.selectedIndex].value;
    subfield.length  =   0 ;
    subfield.options[subfield.length]  =   new  Option('三级分类','');
     for  (i = 0 ; i  <  region.length; i ++ ){
         if  (region[i][ 0 ]  ==  classid){
            subfield.options[subfield.length]  =   new  Option(region[i][ 2 ], region[i][ 1 ]);
        }
    }
}

default2.aspx

<% @ Page Language = " C# "  AutoEventWireup = " true "  CodeFile = " Default2.aspx.cs "  Inherits = " Default2 "   %>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"  >
< HTML >
     < HEAD >
         < title > index </ title >
         < meta  content ="Microsoft Visual Studio .NET 7.1"  name ="GENERATOR" >
         < meta  content ="C#"  name ="CODE_LANGUAGE" >
         < meta  content ="JavaScript"  name ="vs_defaultClientScript" >
         < meta  content ="http://schemas.microsoft.com/intellisense/ie5"  name ="vs_targetSchema" >
         < script  src ="area.js"  type ="text/javascript" ></ script >
         < script  src ="ClassChange.js"  type ="text/javascript" ></ script >
         < script  src ="classFunction.js"  type ="text/javascript" ></ script >
         </ HEAD >
         < body  MS_POSITIONING ="GridLayout" >
         < form  id ="composeform"  method ="post"  runat ="server" >
         < table  class ="table"  id ="Table2"  cellSpacing ="1"  cellPadding ="5"  width ="100%"  border ="0" >
             < TBODY >
                 < tr  class ="xingmu" >
                     < td  align ="center"  colSpan ="4" > 搜索、添加 </ td >
                 </ tr >
                 < tr  class ="back" >
                     < td  style ="WIDTH: 92px"  align ="right" > 分类： </ td >
                     < td  style ="WIDTH: 279px" >
                         < select  name ="RootID"  id ="RootID"  onchange ="CreateClassID(this.form);this.form.KindID.length=1;" >
                             < option  value =""  selected > 一级分类 </ option >
                         </ select >
                         < select  name ="ClassID"  id ="ClassID"  onchange ="CreateKindID(this.form);" >
                             < option  value =""  selected > 二级分类 </ option >
                         </ select >
                         < select  name ="KindID"  id ="KindID" >
                             < option  value =""  selected > 三级分类 </ option >
                         </ select >
                     </ td >
                    
                 </ tr >
                
             </ TBODY >
         </ table >
</ form >
         < script  type ="text/javascript" >
          <!--

        tf = document.composeform;
        CreateRootID(tf, 1 );
        CreateClassID(tf);
        CreateKindID(tf);
    
          // -->
         </ script >

</ body >
</ HTML >