jQuery 逻辑过滤

jQuery logic filtering

本文关键字：过滤 jQuery      更新时间：2023-09-26

我有一个帖子链接列表，这些链接在内部div内有标签。 用户从三个不同的列表中选择来过滤帖子。

从本质上讲，我想要实现的是基于用户选择的三个列表的内容进行前端过滤。

我希望逻辑基本上是这样的：IF post-tags-list has 1+ item from list1 AND has 1+ item from list2 AND has 1+ item from list3, THEN keep the post

以下是我作为开始的内容，但目前的方式是，如果有人没有从其中一个列表中选择任何内容，我需要大量的IF语句来解释。 我知道使用开关可能会更容易，但我不完全确定我的逻辑是否正确。

$(".post-link").each(function(index){
    //Get all the post's terms from its hidden tag div and store in an array
    var terms = $(this).find(".tags").attr('class').split(" ");
    //Cut off the first two items ('hidden' and 'tags')
    terms.splice(0,2);
    //If interests is set
    if(typeof interests[0] != 'undefined'){
        var found = 0;
        var keep = false;
        //For each of the selected interests...
        $.each(interests, function(index, value){
            //For each of the posts terms
            $.each(terms, function(index2, value2){
                //If the posts has a selected interest, keep it
                if(value == value2){ keep=true;}
            });
        });
        //After all that, if we couldn't find anything...
        if(keep!=true){
            //Hide the post (.post-link)
            $(this).hide();
        }
    }
    //THE ABOVE ONLY ACCOUNTS FOR IF SOMETHING IS SELECTED FOR THE FIRST LIST
    //I'M NOT SURE HOW I WOULD IMPLEMENT THIS ACROSS TWO OTHER LISTS
});

如果您需要更多信息，请告诉我。

谢谢！

好的

，所以我找到了解决问题的方法。 基本上对于每个帖子，我设置了一个 show 变量并将其设置为 true（除非另有证明，否则我们希望显示帖子）。 因此，我检查我的三个列表中的每一个中是否有内容，如果我有，那么在foreach中做一个foreach，以检查我的一个帖子术语是否与我选择的项目匹配。 如果有，请保持 show=true，否则为假。 对其他两个列表执行此操作。 在这三次检查之后，如果 show 仍然为真，则每个三个字段中必须至少有一个项目（如果三个适用），如果为 false，则隐藏帖子。

代码如下：

$(".post-link").each(function(index){
    var show = true;
    //Get all the post's terms from its hidden tag div and store in an array
    var terms = $(this).find(".tags").attr('class').split(" ");
    //Cut off the first two items ('hidden' and 'tags')
    terms.splice(0,2);
    //If interests is set
    if(typeof interests[0] != 'undefined'){
        var found = 0;
        $.each(interests, function(index, value){
            $.each(terms, function(index2, value2){
                if(value == value2){ found++; }
            });
        });
        if(found < 1){
            show = false;
        }
    }
    //If type is set
    if(typeof type[0] != 'undefined'){
        var found = 0;
        $.each(type, function(index, value){
            $.each(terms, function(index2, value2){
                if(value == value2){ found++; }
            });
        });
        if(found < 1){
            show = false;
        }
    }
    //If experience is set
    if(typeof experience[0] != 'undefined'){
        var found = 0;
        $.each(experience, function(index, value){
            $.each(terms, function(index2, value2){
                if(value == value2){ found++; }
            });
        });
        if(found < 1){
            show = false;
        }
    }
    if(!show){
        $(this).hide();
    }
});
相关文章：