记录下,以便于下次使用:
HTML:
<div class="layui-form"> <div class="layui-inline"> <select name="d_province" class="state" lay-filter="state"> <option value="0">请选择</option> </select> </div> <div class="layui-inline"> <select name="d_city" class="state" lay-filter="state"> <option value="0">请选择</option> </select> </div> <div class="layui-inline"> <select name="d_area" class="state" lay-filter="state"> <option value="0">请选择</option> </select> </div> </div>
JS:
var $ = layui.jquery; var form = layui.form(); var laydate = layui.laydate; //三级联动 //如果有需要到镇的改改就可以实现 var url = '/Shipper/City/GetCityList'; //数据请求地址 var province = "广东省"; //编辑需要的省 var city = "广州市"; //编辑需要的市 var district = "天河区"; //编辑需要的县/区 getJSON(url, $("select[name='d_province']").closest("div")); form.on('select(state)', function (data) { debugger; $that = $(data.elem); urls = url + "?pid=" + data.value; getJSON(urls, $that.closest("div").next()); }); function getJSON(urls, even) { $.getJSON(urls, function (json) { var pid = 0; var name = even.find("select").attr("name"); var select = "<select name="" + name + "" lay-filter="state">"; select += "<option value="0">请选择 </option>"; $(json).each(function () { select += "<option value="" + this.AreaId + """; if (province == this.AreaName || city == this.AreaName || district == this.AreaName) { select += " selected="selected" "; pid = this.AreaId; } select += ">" + this.AreaName + "</option>"; }); select += "</select>"; even.html(select); var nextName = even.next().find("select").attr("name"); even.next().html("<select name="" + nextName + "" lay-filter="state"><option value="0">请选择 </option></select>"); form.render('select'); if (pid != 0) { getJSON(url + "?pid=" + pid, even.next()); } }); }