ps:需要注意的有: $.get(
"address.json"
,
function
(data) {} 的地址为json地址,地址不对会报异常。
layui.define([
"form"
,
"jquery"
],
function
(exports){
var
form = layui.form,
$ = layui.jquery,
Address =
function
(){};
Address.prototype.provinces =
function
() {
var
proHtml =
''
,that = this;
$.get(
"address.json"
,
function
(data) {
for
(
var
i = 0; i < data.length; i++) {
proHtml +=
'<option value="'
+ data[i].code +
'">'
+ data[i].name +
'</option>'
;
}
$(
"select[name=province]"
).append(proHtml);
form.render();
form.on(
'select(province)'
,
function
(proData) {
$(
"select[name=area]"
).html(
'<option value="">请选择县/区</option>'
);
var
value = proData.value;
if
(value > 0) {
that.citys(data[$(this).index() - 1].childs);
}
else
{
$(
"select[name=city]"
).attr(
"disabled"
,
"disabled"
);
}
});
})
}
Address.prototype.citys =
function
(citys) {
var
cityHtml =
'<option value="">请选择市</option>'
,that = this;
for
(
var
i = 0; i < citys.length; i++) {
cityHtml +=
'<option value="'
+ citys[i].code +
'">'
+ citys[i].name +
'</option>'
;
}
$(
"select[name=city]"
).html(cityHtml).removeAttr(
"disabled"
);
form.render();
form.on(
'select(city)'
,
function
(cityData) {
var
value = cityData.value;
if
(value > 0) {
that.areas(citys[$(this).index() - 1].childs);
}
else
{
$(
"select[name=area]"
).attr(
"disabled"
,
"disabled"
);
}
});
}
Address.prototype.areas =
function
(areas) {
var
areaHtml =
'<option value="">请选择县/区</option>'
;
for
(
var
i = 0; i < areas.length; i++) {
areaHtml +=
'<option value="'
+ areas[i].code +
'">'
+ areas[i].name +
'</option>'
;
}
$(
"select[name=area]"
).html(areaHtml).removeAttr(
"disabled"
);
form.render();
}
var
address =
new
Address();
exports(
"address"
,
function
(){
address.provinces();
});
});