PHP开发中基于layUI的三级联动效果如何实现
后台开发常常用到layUI框架，这样才能让整个页面效果看起来美观大方，然而有时候一些原生的效果放到layUI框架上是无法使用的，比如最近遇到了省市县三级联动的select效果。不同于之前的，layUI框架里，需要重视select的lay-filter属性，来监听事件，另外需要form.render()来重新渲染，解决这两大难题，联动也就不再是难题。下面就来为大家分享下吧。实现代码：
基于 Layui form 组件的省市区级联的实现
选择地区
请选择省
请选择市
请选择县/区
(function(){
var areaData=Area;
var $, $form,form;
var $selectProvince,$selectCity,$selectArea;
layui.use(['jquery', 'form'], function() {
$ = layui.jquery;
form = layui.form();
$form = $('form');
$selectProvince=$form.find('select');
$selectCity=$form.find('select');
$selectArea=$form.find('select');
form.on('select(province)', function(data){
var value = data.value;
var d = value.split('');
var code = d;
var count = d;
var index = d;
if(count > 0) {
loadCity(areaData.mallCityList,index);
$selectCity.parent().show();
} else {
$selectCity.parent().hide();
$selectArea.parent().hide();
$selectCity.find('').remove();
$selectArea.find('').remove();
form.render('select');
}
});
form.on('select(city)', function(data){
var value = data.value;
var d = value.split('');
var code = d;
var count = d;
var index = d;
var areaIndex=d;
if(count > 0) {
loadArea(areaData.mallCityList.mallAreaList);
$selectArea.parent().show();
} else {
$selectArea.parent().hide();
}
});
form.on('select(area)', function(data){
});
loadProvince();
});
function loadProvince(){
for(var i=0,length=areaData.length;i
页:
[1]