用jquery结合json做一个二级联动下拉菜单

hardwin

本文和之前jquery返回json那篇一样，第二级下拉菜单使用dom方式

<script type="text/javascript">$(document).ready(function(){var obj=$("#category");if(typeof obj != 'undefined' && obj !=''){showGongdanType(obj.val());}});function onchangeShow(category){jQuery.ajax({url : "${contextPath}/assets/statistic/ajaxGetType.do",data : {statCategory : category},type : "post",cache : false,dataType : "json",success:onchangecallback});}function onchangecallback(data){     var select_root=document.getElementById('type');    select_root.options.length=0;    select_root.add(new Option("全部",''));    for(var i=0;i<data.length;i++){    var xValue=data[i].value;             var xText=data[i].valueName;             var option=new Option(xText,xValue);             select_root.add(option);    }}function showGongdanType(category){jQuery.ajax({url : "${contextPath}/assets/statistic/ajaxGetType.do",data : {statCategory : category},type : "post",cache : false,dataType : "json",success:callback});}function callback(data){     var select_root=document.getElementById('type');    select_root.options.length=0;    select_root.add(new Option("全部",''));    for(var i=0;i<data.length;i++){    var xValue=data[i].value;             var xText=data[i].valueName;             var option=new Option(xText,xValue);             select_root.add(option);    }    if("${gongdanType}"!=''){    for(var i=0;i<data.length;i++){    if(data[i].value=="${gongdanType}")    select_root.selectedIndex=i+1;    }    }}</script><td width="10%" height="25" class="alignLeft">统计类别：</td><td width="10%" valign="top" class="alignLeft"><s:select name="form.category" list="categorys" id="category"listKey="value" listValue="valueName" onchange="onchangeShow(this.value)"></s:select></td><td width="10%" height="25" class="alignLeft">工单类型：</td><td width="10%" valign="top" class="alignLeft"> <select name="form.gongdanType" id="type" >   </select></td>