1     <form id="form">
 2         <div id="select-class" name="typeClass">
 3             <select name="main_business_type_0"  id="class-0">
 4                 <option>请选择门类</option>
 5             </select>
 6             /
 7             <select name="main_business_type_1" id="class-1">
 8                 <option>请选择大类</option>
 9             </select>
10             /
11             <select name="main_business_type_2" id="class-2">
12                 <option>请选择中类</option>
13             </select>
14             /
15             <select name="main_business_type_3" id="class-3">
16                 <option>请选择小类</option>
17             </select>
18         </div>
19     </form>

        $("#select-class").each(function(){var temp_html ;var oClass_0 = $(this).find("#class-0")//门类var oClass_1 = $(this).find("#class-1")//大类var oClass_2 = $(this).find("#class-2")//中类var oClass_3 = $(this).find("#class-3")//小类var class_0_key_array = [] ;//门类键名组成的数组var class_1_key_array = [] ;//大类键名组成的数组var class_2_key_array = [] ;//中类键名组成的数组var class_0_selected_index = 0 ;var class_1_selected_index = 0 ;var class_2_selected_index = 0//初始化门类var class_0_init = function(){class_0_key_array = [] ;//初始化门类键名组成的数组$.each(classJson , function(key,value){class_0_key_array.push(key) ;temp_html += "<option value='"+value.trade_name+"'>"+value.trade_name+"</option>";});//渲染门类
                oClass_0.html(temp_html);//渲染完成后清空temp_htmltemp_html = "";//当门类被选择并初始化后,初始化大类
                class_1_init(class_0_key_array) ;};//初始化大类var class_1_init = function(class_0_key_array){//初始化大类键名组成的数组class_1_key_array = [] ;                //判断由上级往下传的key_array长度是否为0if (class_0_key_array.length != 0) {//若key_array长度为0,则说明无需渲染此节点及更深节点,直接往下传空array//若key_array长度不为0,则继续渲染class_0_selected_index = oClass_0.get(0).selectedIndex;//选了第几个$.each(classJson[class_0_key_array[class_0_selected_index]].children , function(key,value){class_1_key_array.push(key) ;temp_html += "<option value='"+value.trade_name+"'>"+value.trade_name+"</option>";});}//渲染大类
                oClass_1.html(temp_html) ;//渲染完成后清空temp_htmltemp_html = "";//当大类被选择并初始化后,初始化中类
                class_2_init(class_1_key_array) ;};//初始化中类var class_2_init = function (class_1_key_array){//初始化中类键名组成的数组class_2_key_array = [] ;//判断由上级往下传的key_array长度是否为0if (class_1_key_array.length != 0) {//若key_array长度为0,则说明无需渲染此节点及更深节点,直接往下传空array//若key_array长度不为0,则继续渲染class_1_selected_index = oClass_1.get(0).selectedIndex ;//选择了第几个$.each(classJson[class_0_key_array[class_0_selected_index]].children[class_1_key_array[class_1_selected_index]].children , function(key,value){class_2_key_array.push(key) ;temp_html += "<option value='"+value.trade_name+"'>"+value.trade_name+"</option>";});}//渲染中类
                oClass_2.html(temp_html);//渲染完成后清空temp_htmltemp_html = "";//当中类被选择并初始化后,初始化小类
                class_3_init(class_2_key_array) ;};//初始化小类var class_3_init = function(class_2_key_array){//初始化小类键名组成的数组class_3_key_array = [] ;//判断由上级往下传的key_array长度是否为0if (class_2_key_array.length != 0) {//若key_array长度为0,则说明无需渲染此节点及更深节点,直接往下传空array//若key_array长度不为0,则继续渲染//捕获选中的中类位置class_2_selected_index = oClass_2.get(0).selectedIndex ;$.each(classJson[class_0_key_array[class_0_selected_index]].children[class_1_key_array[class_1_selected_index]].children[class_2_key_array[class_2_selected_index]].children , function(key , value){class_3_key_array.push(key) ;temp_html += "<option value='"+value.trade_name+"'>"+value.trade_name+"</option>";                    });}//渲染小类
                oClass_3.html(temp_html);//渲染完成后清空temp_htmltemp_html = "" ;//遍历完成,end
}//改变门类的时候联动大类oClass_0.change(function(){class_1_init(class_0_key_array);});//改动大类的时候联动中类oClass_1.change(function(){class_2_init(class_1_key_array);});//改变中类的时候联动小类oClass_2.change(function(){class_3_init(class_2_key_array);})class_0_init();});