//筛选 var typeid = "<!--{$typeid}-->"; var bigclassid = "<!--{$bigclassid}-->"; var smallclassid = "<!--{$smallclassid}-->"; $("#typeid option[value="+typeid+"]").attr("selected",true); $("#typeid").change(); $("#bigclassid option[value="+bigclassid+"]").attr("selected",true); $("#bigclassid").change(); $("#smallclassid option[value="+smallclassid+"]").attr("selected",true);
获取值后，设置自动选中。
选中之后，调用change()方法。change方法会显示出下一级的select框。然后再选中，再调用change()方法。这样就把三级的select框都显示出来了，并且默认选中了。
$(document).ready(function(){ //ajax级联 $("#typeid").change(function(){ var id = $(this).val(); setbigclass(id); }); $("#bigclassid").change(function(){ var id = $(this).val(); setsmallclass(id); }); $("#screen_submit").click(function(){ $("#screenform").submit(); }); }); function setbigclass(id){ var res = ajaxgetbigclass(id); if(res){ myobj = eval(res); var strhtml="<option value=0>全部大类</option>"; for(var i=0;i<myobj.length;i++){ strhtml+="<option value='"+myobj[i].id+"'>"+myobj[i].name+"</option>"; } $("#bigclassid").html(strhtml); $("#bigclassid").show().change(); }else{ $("#bigclassid").html('<option value=""></option>').hide(); $("#smallclassid").html('<option value=""></option>').hide(); } } function setsmallclass(id){ var res = ajaxgetsmallclass(id); if(res){ myobj = eval(res); var strhtml="<option value=0>全部子类</option>"; for(var i=0;i<myobj.length;i++){ strhtml+="<option value='"+myobj[i].id+"'>"+myobj[i].name+"</option>"; } $("#smallclassid").html(strhtml); $("#smallclassid").show(); }else{ $("#smallclassid").html('').hide(); } }
希望本文所述对大家jquery程序设计有所帮助。
更多jquery select自动选中功能实现方法分析。