电商类
个博客(建设ing)
查看代码
        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);
            }
          });
  
        })