使用 jquery 按类别过滤 Wordpress 帖子答案

【问题标题】：Using jquery to filter Wordpress posts by categories使用 jquery 按类别过滤 Wordpress 帖子
【发布时间】：2012-08-19 06:37:11
【问题描述】：

我正在尝试显示可以过滤的新闻提要。

假设 wordpress 类别“新闻”具有“体育”“商业”和“Region1”、“Region2”、“Region3”..等子类别

所以页面将如下所示：

          ** ALL NEWS | Sports | Business  **

区域 1

区域 2

区域 3

这是我在 Wordpress 循环中的帖子：

                   //Get all posts with a category of "NEWS"
                    query_posts('cat=1' );
                while (have_posts()) : the_post();
                echo '<li class="';

                        //Display the categories
                        $categories = get_the_category();
                        $output = '';

                        if($categories){
                            foreach((get_the_category()) as $category) { 
                            $output = $category->cat_name .'-';
                            echo $output;
                            } 
                    }

这显示：

<li class="news-sports-region1">Article1</li>
<li class="news-business-region2">Article2</li>
<li class="news-sports-region3-">Article3</li>

因此，在我的 jquery 脚本中，我试图找出处理用户单击每个类别时的最佳方法。如果您有比我尝试做的更简单的解决方案，请告诉我。

我需要以下代码：

如果用户点击“体育”，则隐藏 CLASS 中所有没有“体育”一词的帖子。我还需要知道如何记住单击了哪个区域并按所选区域进行过滤。

我的代码现在一团糟，有一堆我无法工作的不同解决方案。我试图通过将类别应用为“数据类别”属性进行过滤，但在某处遇到了障碍。

请帮忙，谢谢！

【问题讨论】：

标签： jquery wordpress filter toggle categories

【解决方案1】：

首先，如果您不将不同的类连接在一起会有所帮助（即，只需在“新闻体育区”之间放置一个空格）。这样，您可以将一个类应用于一个特定的类（“新闻”或“体育”），而不必做一些复杂的事情来选择类的一部分（如 div[class*='news-']）。如果你完成了，那么它将如下所示：

<li class="news sports region1">Article1</li>
<li class="news business region2">Article2</li>
<li class="news sports region3-">Article3</li>

然后，您需要 jquery 做的就是为这些类别的显示/隐藏设置动画。比如：

$('.news').hide(600)
$('.sports').show(600)

我自己并不是特别擅长 JQuery，所以这只是一个关于如何做的概述。希望它能让你开始。

【讨论】：