使用“AND”方法设置多项过滤器

Question

我想设置一个jQuery多项过滤器，使用AND方法。
例如，搜索foo bar或foo+bar会返回其值中包含 {/ 1>} foo和bar个字符串的项目，但不包含foo或bar。

现在，我使用此代码：

$('#filter').keyup(function(ev) {
    $('div').show();
    if($(this).val() != '') {
        var terms = $(this).val().toLowerCase().split(/[\s+]+/); 
        $('div').hide()
        for (var i = 0, n = terms.length; i < n; i++) {
            $('div[data-search*="'+terms[i]+'"]').show();
        };
    }
});

// "nihil"       returns 2 results
// "nulla"       returns 1 result
// "nihil nulla" returns 3 results

div {
    border: 1px solid black;
    margin: 2px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<input id="filter" type="text" placeholder="Filter">

<div data-search="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel mollitia recusandae porro quidem optio expedita veritatis aliquid debitis explicabo incidunt odit beatae laboriosam rem amet quis corporis assumenda rerum ab!">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vel mollitia recusandae porro quidem optio expedita veritatis aliquid debitis explicabo incidunt odit beatae laboriosam rem amet quis corporis assumenda rerum ab!</div>
<div data-search="Eligendi quasi maxime accusantium vel alias nihil dolorum enim maiores aspernatur ab cumque iusto exercitationem dicta deleniti qui ipsa perferendis doloremque non quod itaque earum at sunt. A consequatur in.">Eligendi quasi maxime accusantium vel alias nihil dolorum enim maiores aspernatur ab cumque iusto exercitationem dicta deleniti qui ipsa perferendis doloremque non quod itaque earum at sunt. A consequatur in.</div>
<div data-search="Rerum ratione temporibus nulla dolorem cum minus dolores eius quia natus pariatur. Non nisi sunt iusto officiis ipsa adipisci illo enim ratione repudiandae sint iure repellat tempore est ea omnis.">Rerum ratione temporibus nulla dolorem cum minus dolores eius quia natus pariatur. Non nisi sunt iusto officiis ipsa adipisci illo enim ratione repudiandae sint iure repellat tempore est ea omnis.</div>
<div data-search="Quos nihil alias ipsam voluptates eius itaque tempora sapiente natus odio nobis possimus voluptate! Aspernatur ea molestiae dolor voluptatem beatae vel rerum adipisci minima maiores at a alias maxime eos.">Quos nihil alias ipsam voluptates eius itaque tempora sapiente natus odio nobis possimus voluptate! Aspernatur ea molestiae dolor voluptatem beatae vel rerum adipisci minima maiores at a alias maxime eos.</div>
<div data-search="Incidunt nobis harum quasi voluptas sed quo qui repellendus tempore architecto. Maxime aliquid officia similique culpa molestiae nobis incidunt praesentium ducimus sunt necessitatibus veritatis iusto quis esse vitae hic perferendis.">Incidunt nobis harum quasi voluptas sed quo qui repellendus tempore architecto. Maxime aliquid officia similique culpa molestiae nobis incidunt praesentium ducimus sunt necessitatibus veritatis iusto quis esse vitae hic perferendis.</div>

您可以清楚地看到这与OR方法一起使用，然后搜索foo bar也会返回仅包含foo或bar的结果。如何将此OR方法更改为AND方法？

请注意我的主要问题是这些条款可以是除搜索字段之外的其他顺序。

感谢您的帮助。

Answer 1

您可以将字符串连接为选择器：

$('#filter').keyup(function(ev) {
    $('div').show();
    if($(this).val() != '') {
        var terms = $(this).val().toLowerCase().split(/[\s+]+/); 
        $('div').hide()
        var selector = "div";
        for (var i = 0, n = terms.length; i < n; i++) {
            selector += '[data-search*="'+terms[i]+'"]';
        };
        $(selector).show();
    }
});

DEMO