<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 transitional//en" > <ptml> <pead> <title>js linkage dropdown box ;/title> <meta name= "generator content=" Microsoft FrontPage 4.0 "> <meta name=" ProgId "content=" Frontpag E.editor.document "> <meta name=" originator content= "Microsoft Visual Studio. NET 7.1" > <script language = "JavaScript" >/* * * * ======================================================================================== ========== * * Class Name: Class_liandong_yao * * Function: Multi-level LINK Menu * * * Author: Yaodayizi * * ===================== ============================================================================= **/function CLASS_LIANDONG_YAO ( Array) {//arrays, linkage data source this.array=array; This.indexname= '; This.obj= '; Set Sub Select//parameter: Select ID of the current onchange, select ID this.subselectchange=function to set (selectname1,selectname2) {//try//{ var obj1=document.all[selectname1]; var obj2=document.all[selectname2]; var objname=this.tostring (); var me=this; Obj1.onchange=function () {Me.optionchange (this.options[this.selectedindex].value,obj2.id)} //Set the first select//parameter: IndexName refers to the selected item, Selectname refers to the ID this.firstselectchange=function of the Select (Indexn Ame,selectname) {This.obj=document.all[selectname]; This.indexname=indexname; This.optionchange (This.indexname,this.obj.id)}//IndexName refers to the selected item Selectname refers to the ID of the select This.optioncha Nge=function (indexname,selectname) {var obj1=document.all[selectname]; var me=this; obj1.length=0; Obj1.options[0]=new option ("Please select", ""); for (Var i=0;i<this.array.length;i++) {if (this.array[i][1]==indexname) {//al ERT (this.array[i][1]+ "" +indexname); Obj1.options[obj1.length]=new Option (This.arrayI [2],this.array[i][0]); {}}} </script> </pead> <body> <form name= "Form1" method= " Post "> <select id=" S1 "name=" S1 "> <option selected></option> </ select> <select id= "s2" name= "s2" > <option selected></option> </SELECT> <select id= "S3" Name= "S3" > <option selected></option> </SELECT> <select id= "x1" name= "x1" > <option selected></option> </SELECT> < Select Id= "X2" name= "x2" > <option selected></option> </SELECT> <select id= "X3" "Name=" x3 "> <option selected></option> </SELECT> <select id=" x4 "name=" x4 "> <option selected></option> </SELECT> <select id= "x5" name= "x5" > <option selected></option> </SELECT> </form> </body> <script language= "JavaScript" >//Example 1-------------------------------------------------------------//Data SOURCE var array=new array (); Array[0]=new Array ("South China", "root directory", "South China"); Data format ID, parent ID, name array[1]=new array ("North China", "root directory", "North China"); Array[2]=new Array ("Shanghai", "South China", "Shanghai"); Array[3]=new Array ("Guangdong", "South China", "Guangdong"); Array[4]=new Array ("Xujiahui", "Shanghai", "Xujiahui"); Array[5]=new Array ("Phut", "Shanghai", "Phut"); Array[6]=new Array ("Guangzhou", "Guangdong", "Guangzhou"); Array[7]=new Array ("Zhanjiang", "Guangdong", "Zhanjiang"); --------------------------------------------//This is the calling code var liandong=new class_liandong_yao (Array)//setting Data source Liando Ng.firstselectchange ("root directory", "S1"); Sets the first selection box Liandong.subselectchange ("S1", "S2"); Sets the child selection box Liandong.subselectchange ("S2", "S3"); Example 2-------------------------------------------------------------//Data source var array2=new Array()//Data format ID, parent ID, name Array2[0]=new Array ("Test test", "root directory", "Test test"); Array2[1]=new Array ("North China", "root directory", "North China"); Array2[2]=new Array ("Shanghai", "Test test", "Shanghai"); Array2[3]=new Array ("Guangdong", "Test test", "Guangdong"); Array2[4]=new Array ("Xujiahui", "Shanghai", "Xujiahui"); Array2[5]=new Array ("Phut", "Shanghai", "Phut"); Array2[6]=new Array ("Guangzhou", "Guangdong", "Guangzhou"); Array2[7]=new Array ("Zhanjiang", "Guangdong", "Zhanjiang"); Array2[8]=new Array ("Don't Know", "Zhanjiang", "Don't Know"); Array2[9]=new Array ("5555", "Zhanjiang", "555"); Array2[10]=new Array ("++++", "Don't Know", "++++"); Array2[11]=new Array ("111", "Xujiahui", "111"); Array2[12]=new Array ("222", "111", "222"); Array2[13]=new Array ("333", "222", "333"); --------------------------------------------//This is the calling code//setting data source var liandong2=new Class_liandong_yao (array2); Sets the first selection box Liandong2.firstselectchange ("root", "x1"); Sets the child selection box Liandong2.subselectchange ("x1", "X2") liandong2.subselectchange ("X2", "x3") Liandong2.subselectchange ("x3") , "x4") Liandong2.subselectchange ("X4", "x5") </script> ≪/html>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]