SSH结合jquery实现三级联动效果
本文实例为大家分享了jquery实现三级联动的具体代码,供大家参考,具体内容如下
jsp页面部分:
<liid="floors"> <spanclass="title"id="floorShow">选择楼栋:</span> <selectname="build"id="build"style="width:282px;height:40px;"onchange="floor2()"> </select> </li> <liid="builds"> <spanclass="title"id="floorShow">选择住房:</span> <selectname="builds"id="floot2"style="width:282px;height:40px;"> </select> </li>
js部分:
functionfloor(){ document.getElementById("build").options.length=0; document.getElementById("floot2").options.length=0; varparentId=document.getElementById("village").value; if(parentId==0){ }else{ $.ajax({ type:"post", url:"floor.action", data:{"parentId":parentId}, dataType:"json", success:function(data){ console.log(data); varlen=data.length; varhtm="<optionvalue='0'>请选择</option>"; for(vari=0;i<len;i++){ htm+="<optionvalue='"+data[i].id+"'>"+data[i].info+"</option>"; } $("#build").append(htm); } }) } } functionfloor2(){ document.getElementById("floot2").options.length=0; varbuild=document.getElementById("build").value; if(build==0){ }else{ $.ajax({ type:"post", url:"floor2.action", data:{"parentId":build}, dataType:"json", success:function(data){ varlen=data.length; varhtm="<optionvalue='0'>请选择</option>"; for(vari=0;i<len;i++){ htm+="<optionvalue='"+data[i].id+"'>"+data[i].info+"</option>"; } $("#floot2").append(htm); } }) } }
struts2配置部分:
<packagename="user"namespace="/"extends="json-default"> <actionname="floor"class="addressInfoAction"method="floor"> <resulttype="json"> <paramname="root">floor</param> </result> </action> <actionname="floor2"class="addressInfoAction"method="floor2"> <resulttype="json"> <paramname="root">floor2</param> </result> </action> </package>
action部分:
publicStringfloor(){ System.out.println("这里是ajax调用"); //floor=addressInfoService.getFloor(addressInfo.getParentId()); System.out.println(addressInfo.getParentId()); floor=addressInfoService.getFloor(addressInfo.getParentId()); returnSUCCESS; } publicStringfloor2(){ System.out.println("这里是ajax的第二次调用"); System.out.println(addressInfo.getParentId()); floor2=addressInfoService.getBuild(addressInfo.getParentId()); returnSUCCESS; }
最后,一定不要忘记导入struts2-json-plugin-2.3.15.1.jar这个夹包的版本也要和struts2的其他的夹包的版本一致。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。