jquery怎样实现怎样实现ajax联动框联动框(二二)
另一种形式的联动框,右边的联动框用jquery生成
这是仿照上篇的js方法修改的
先看下页面代码:
代码如下:
<tr id=”sfqySelect”>
<td width=”100″ class=”t_r prten field_c”>事发区域:</td>
<td width=”131″>
<select class=”building”></select>
</td>
<td width=”10″></td>
<td width=”131″>
<input id=”choose_floor” class=”text_k choose_floor” type=”text” value=”点击选择楼层”>
<input class=”choose_floor_hidden FL {validate:{required:true}}” type=”hidden” name=”geoareaid” value=””>
<div id=”floorNum” class=’floorNum’></div>
</td>
</tr>
页面调用的js:
代码如下:
<script type=”text/javascript” src=”${rc.contextPath}/js/jquery.building.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){
$(“#sfqySelect”).building({
nodata:”none”,
required:true,
buildingUrl:’${rc.contextPath}/repair/loadBuildings’,
floorUrl:’${rc.contextPath}/repair/loadFloors’,
clickCallback:function(value,text,other){
moveGis(other);
}
});
});
</script>
对应的 jquery.building.js 文件如下:
代码如下:
/*
Ajax 三级联动
日期:2013-2-26
settings 参数说明
—–
buildingUrl:大楼下拉数据获取URL,josn返回
buildingValue:默认大楼下拉value
floorUrl:楼层数据获取URL,josn返回
floorValue:默认楼层value
nodata:无数据状态
required:必选项
clickCallback:点击时的回调函数
—————————— */
(function($){
$.fn.building=function(settings){
if($(this).size()<1){return;};
// 默认值
settings=$.extend({
buildingUrl:”js/city.min.js”,
floorUrl:”js/city.min.js”,
buildingValue:null,
floorValue:null,
nodata:null,