<div class="layui-form-item">
<label class="layui-form-label">城市</label>
<div class="layui-input-inline">
<select name="city" lay-filter="province">
<option value=""></option>
<option value="11">北京市</option>
<option value="12">天津市</option>
................
</select>
</div>
<div class="layui-input-inline">
<select name="city" id="city">
<option value=""></option>
</select>
</div></div>
js操作部分
form.on('select(province)', function(data){
$.getJSON("/api/getCity?pid="+data.value, function(data){ var optionstring = "";
$.each(data.data, function(i,item){
optionstring += "<option value=\"" + item.code + "\" >" + item.name + "</option>";
});
$("#city").html('<option value=""></option>' + optionstring);
form.render('select'); //这个很重要
});
});
后台返回的数据格式json
{ "status": 200, "message": "result", "data": [
{ "code": "3418", "name": "宣城市", "province": "34"
},
{ "code": "3417", "name": "池州市", "province": "34"
},
{ "code": "3416", "name": "亳州市", "province": "34"
},
{ "code": "3415", "name": "六安市", "province": "34"
},
{ "code": "3413", "name": "宿州市", "province": "34"
},
{ "code": "3412", "name": "阜阳市", "province": "34"
},
{ "code": "3411", "name": "滁州市", "province": "34"
},
{ "code": "3408", "name": "安庆市", "province": "34"
},
{ "code": "3407", "name": "铜陵市", "province": "34"
},
{ "code": "3406", "name": "淮北市", "province": "34"
},
{ "code": "3405", "name": "马鞍山市", "province": "34"
},
{ "code": "3404", "name": "淮南市", "province": "34"
},
{ "code": "3403", "name": "蚌埠市", "province": "34"
},
{ "code": "3402", "name": "芜湖市", "province": "34"
},
{ "code": "3401", "name": "合肥市", "province": "34"
}
]
}
