用jquery结合json做一个二级联动下拉菜单
本文和之前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.value; var xText=data.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.value; var xText=data.valueName; var option=new Option(xText,xValue); select_root.add(option); } if("${gongdanType}"!=''){ for(var i=0;i<data.length;i++){ if(data.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>
页:
[1]