<div class="layui-form-item"> <div class="layui-inline"> <label class="layui-form-label" style="width: 140px"> <span style="color: red">*</span>现住址: </label> <div class="layui-input-inline"> <select name="sel_province" lay-verify="required" id="sel_province" lay-filter="sel_province"> </select> </div> <div class="layui-input-inline"> <select name="sel_city" lay-verify="required" id="sel_city" lay-filter="sel_city"></select> </div> <div class="layui-input-inline"> <select name="sel_county" lay-verify="required" id="sel_county" lay-filter="sel_county"></select> </div> <div class="layui-input-inline"> <input type="text" style="width:180px" id="diseaseaddress" name="diseaseaddress" placeholder="请输入详细地址" lay-verify="title" autocomplete="off" class="layui-input"> </div> </div> </div> initPcc('330000','330100','330127'); //初始化省市县 浙江省 杭州市 淳安县, 可用于回显 function initPcc(procode,citycode,countycode){ //初始化省 $.ajax({ url: 'footborne/dict/province.htm', // 后台取到所有的省份名称 dataType: 'json', type: 'get', success: function (resData) { $('#sel_province').empty(); var option = "<option value=''>请选择</option>"; var selData = resData.data; for(var i = 0; i < selData.length; i++){ if(selData[i].value == procode){ option += ("<option value=" + selData[i].value + " selected>" + selData[i].name + "</option>"); continue; } option += ("<option value=" + selData[i].value + ">" + selData[i].name + "</option>"); } $("#sel_province").append(option); form.render('select');//渲染select } }); //初始化市 $.ajax({ url: 'footborne/dict/city.htm', dataType: 'json', type: 'get', data: { selProvince: procode }, success: function (resData) { $('#sel_city').empty(); var option = "<option value=''>请选择</option>"; var selData = resData.data; for(var i = 0; i < selData.length; i++){ if(selData[i].value == citycode){ option += ("<option value=" + selData[i].value + " selected>" + selData[i].name + "</option>"); continue; } option += ("<option value=" + selData[i].value + ">" + selData[i].name + "</option>"); } $("#sel_city").append(option); form.render('select');//渲染select } }); //初始化县 $.ajax({ url: 'footborne/dict/county.htm', dataType: 'json', type: 'get', data: { selCity: citycode }, success: function (resData) { $('#sel_county').empty(); var option = "<option value=''>请选择</option>"; var selData = resData.data; for(var i = 0; i < selData.length; i++){ if(selData[i].value == countycode){ option += ("<option value=" + selData[i].value + " selected>" + selData[i].name + "</option>"); continue; } option += ("<option value=" + selData[i].value + ">" + selData[i].name + "</option>"); } $("#sel_county").append(option); form.render('select');//渲染select } }); } // 第二步 form.on('select(sel_province)', function(data){ $('#sel_city').empty(); $('#sel_county').empty(); var sel_province_value = data.value; // roomName 选中的省份名称 $.ajax({ url: 'footborne/dict/city.htm', dataType: 'json', type: 'get', data: { selProvince: sel_province_value }, success: function (resData) { $('#sel_city').empty(); var option = "<option value=''>请选择</option>"; var selData = resData.data; for(var i = 0; i < selData.length; i++){ option += ("<option value=" + selData[i].value + ">" + selData[i].name + "</option>"); } $("#sel_city").append(option); form.render('select');//渲染select } }); }); // 第三步 form.on('select(sel_city)', function(data){ var sel_city_value = data.value; // roomName 选中的省份名称 $.ajax({ url: 'footborne/dict/county.htm', dataType: 'json', type: 'get', data: { selCity: sel_city_value }, success: function (resData) { $('#sel_county').empty(); var option = "<option value=''>请选择</option>"; var selData = resData.data; for(var i = 0; i < selData.length; i++){ option += ("<option value=" + selData[i].value + ">" + selData[i].name + "</option>"); } $("#sel_county").append(option); form.render('select');//渲染select } }); });