javascript - 在javascript/jquery上过滤几个条件

我陷入这个问题。有一个简单的过滤器，它不能完全按照我的需要运行：http://jsfiddle.net/qyy810xx/
CSS在这里：

.categorya, .categoryb, .categoryrko {

    width: 30px;
    height: 20px;
    line-height:20px;
    text-align:center;
    background: red;
    margin: 10px;
    float: left;
    font-size:11px;
    color:white;
    font-family:sans-serif;
}
.categoryb {
    background: blue;
}

.categorya.categoryb{
    background:purple;
}
p.info{
    padding:30px 20px 0 20px;
    color:#666;
    font-family:sans-serif;
    font-size:13px;
}

HTML：

<ul id="filters">
    <li>
        <input type="checkbox" value="categorya" id="filter-categorya" />
        <label for="filter-categorya">Category A</label>
    </li>
    <li>
        <input type="checkbox" value="categoryb" id="filter-categoryb" />
        <label for="filter-categoryb">Category B</label>
    </li>
    <li>
        <input type="checkbox" value="categoryrko" id="filter-categoryrko" />
        <label for="filter-categoryrko">RKO</label>
    </li>
</ul>

<div class="categorya categoryb">A, B</div>
<div class="categorya">A</div>
<div class="categorya">A</div>
<div class="categorya">A</div>
<div class="categoryrko">RKO</div>
<div class="categoryb categoryrko">BRko</div>
<div class="categoryb">B</div>
<div class="categoryb">B</div>

和脚本：

 $("#filters :checkbox").click(function() {

   var re = new RegExp($("#filters :checkbox:checked").map(function() {
                          return this.value;
                       }).get().join("|") );
   $("div").each(function() {
      var $this = $(this);
      $this[re.source!="" && re.test($this.attr("class")) ? "show" : "hide"]();
   });
});

如果选择categoryB，我们只能看到categoryB类的div，但是我需要查看所有div，包括categoryB类。
例如如果选择categoryA，则必须显示[A，B]块，所有[A]块和[RKOa]块，但是，如果选择categoryA和categoryRKO，则必须仅显示[RKOa]块。即只有一个满足所有参数的块。

我会很高兴的

最佳答案

您无需进行正则表达式，只需使用相同的逻辑制定选择器

$("#filters :checkbox").click(function() {

   var selector = $("#filters :checkbox:checked").map(function() {
                          return "." + this.value;
                  }).get().join(",");
   $("div").hide().filter(selector).show(); //now show only those which are matching the selector chosen above
});

关于javascript - 在javascript/jquery上过滤几个条件，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/47547832/