与多个条件

Question

jQuery的油滑滑块滤波下面是光滑滑块一个HTML：

<div class="slick"> 
    <div class="black phone"></div> 
    <div class="white phone"></div> 
    <div class="green phone"></div> 
    <div class="black ipad"></div> 
    <div class="white ipad"></div> 
    <div class="green ipad"></div> 
    <div class="black tablet"></div> 
    <div class="white tablet"></div> 
    <div class="green tablet"></div> 
</div> 

我需要的颜色（黑，白，绿）和装置（手机，ipad公司，片剂）进行过滤。 因此，例如，需要按类名.white和.tablet进行过滤。 过滤格式为：“颜色”和“设备”。它是动态的，而不是静态的。 请指教我。任何帮助将不胜感激。 谢谢。

Answer 1

这是不可能的。 滑动滑块不支持这种过滤。

Answer 2

可以使用滑动滑块过滤多个条件。你需要过滤所有的条件。

let slidesToKeep = ['.green.tablet', '.green.phone', '.ipad']; 
$slickSlider.slick('slickFilter', String(slidesToKeep)); 

Answer 3

这其实很简单。

由于光面只是使用jquery的.filter()http://api.jquery.com/filter/，你可以在一个字符串中使用多个类选择器。只需加入你想用逗号保留的课程即可。

 let slidesToKeep = ['.green.tablet', '.green.phone', '.ipad'].join(','); 
    // slidesToKeep now equals '.green.tablet,.green.phone,.ipad' 
    $('.slick').slick('slickFilter', slidesToKeep); 

我创建了一个codepen演示，让您可以根据需要添加尽可能多的过滤器：Slick Carousel multiple filter demo。