电商类
查看代码
layui.use(['layer', 'layFilter'], function () {
var $ = layui.jquery;
var layer = layui.layer;
var layfilter = layui.layFilter;
var dataSource1 = []; //太长了,就不展示了,直接看源码吧
var filter1 = layfilter.render({
elem: '#layfilter1',
itemWidth: 80 ,
labelWidth: 100,
dataSource:dataSource1,
color: "#FF5722",
success: (data)=>{
},
onChange: (status, data, dom)=>{
console.log("filter1 is change",status,data,dom);
}
});
//获取选中值(直接获取)
$('#getValBtn1').click(function () {
layer.alert(JSON.stringify(filter1.getValue()));
});
//全部重置
$("#resetBtn1").click(function(){
filter1.resetFilter(function(){
layer.msg('重置了!');
})
});
//设置禁用
$("#setDisabledBtn1").click(function() {
filter1.setDisabled('brand','chuizi')
});
})
影视类
查看代码
layui.use(['layer', 'layFilter'], function () {
var $ = layui.jquery;
var layer = layui.layer;
var layfilter = layui.layFilter;
var dataSource2 = []; //太长了,就不展示了,直接看源码吧
var filter2 = layfilter.render({
elem: '#layfilter2',
labelWidth: 80,
dataSource:dataSource2,
color: "#009688",
success: (data)=>{
data.setValue('category','123')
data.setValue('day','137','138')
data.setDisabled('category','aiqing')
},
onChange: (status, data, dom)=>{
console.log("filter2 is change",status,data);
}
});
//获取选中值(回调获取)
$('#getValBtn2').click(function () {
filter2.getValue(function (data) {
layer.alert(JSON.stringify(data));
})
});
//重置(指定类别)
$("#resetBtn2").click(function(){
filter2.resetFilter(function(){
layer.msg(`重置了[类别]!`);
},'category')
})
//设置禁用
$("#setDisabledBtn2").click(function() {
filter2.setDisabled('category','jingsong')
})
})
社交类
查看代码
layui.use(['layer', 'layFilter'], function () {
var $ = layui.jquery;
var layer = layui.layer;
var layfilter = layui.layFilter;
var filter3 = layfilter.render({
elem: '#layfilter3',
labelWidth: 180,
dataSource,
color: "#1E9FFF",
success: (data)=>{
},
onChange: (status, data, dom)=>{
console.log(status,data);
}
});
})