js为WEUI+ 的city.data.js
layui Html:
<label class="layui-form-label" style="width: 100px;">城市</label>
<div class="layui-input-inline">
<select lay-filter="province" id="province" name="increment_province">
</select>
</div>
<div class="layui-input-inline">
<select lay-filter="city" id="city" name="increment_city">
</select>
</div>
<div class="layui-input-inline">
<select lay-filter="area" id="area" name="increment_area">
</select>
</div>
</div>
JQ
$(function () {
$.getJSON("/weui/js/city.data.js", function (data){
var str = ‘‘;
str += ‘<option value="0">选择省份</option>‘;
for(var i in data) {
str += ‘<option value="‘+data[i].name+‘">‘+data[i].name+‘</option>‘;
};
$(‘#province‘).html(str);
form.render();
})
})
//城市
form.on(‘select(province)‘, function(datas){
var province = datas.value;
$.getJSON("/weui/js/city.data.js", function (data){
var str = ‘‘;
for(var i in data) {
if (data[i].name == province)
{
var sub = data[i].sub;
// console.log(sub);
for(var k in sub) {
str += ‘<option value="‘+sub[k].name+‘">‘+sub[k].name+‘</option>‘;
};
}
};
$(‘#city‘).html(str);
form.render();
})
})
//县/区
form.on(‘select(city)‘, function(datas){
var province = $(‘#province‘).val();
var city = datas.value;
$.getJSON("/weui/js/city.data.js", function (data){
var str = ‘‘;
for(var i in data) {
if (data[i].name == province)
{
var sub = data[i].sub;
// console.log(sub);
for(var k in sub) {
if (sub[k].name == city)
{
var subs = sub[k].sub;
for(var c in subs) {
str += ‘<option value="‘+subs[c].name+‘">‘+subs[c].name+‘</option>‘;
};
};
};
};
};
$(‘#area‘).html(str);
form.render();
})
})
原文:https://www.cnblogs.com/niuzilong/p/13762488.html