1

フィルタリングできるニュースフィードを表示しようとしています。

ワードプレスのカテゴリ「NEWS」には、「スポーツ」、「ビジネス」、「リージョン1」、「リージョン2」、「リージョン3」などのサブカテゴリがあるとします。

したがって、ページは次のようになります。

          ** 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スクリプトでは、ユーザーが各カテゴリをクリックしたときに処理するための最良の方法を見つけようとしています。私がやろうとしていることよりも簡単な解決策があれば教えてください。

次のコードが必要です：

ユーザーが「スポーツ」をクリックした場合、クラスに「スポーツ」という単語が含まれていないすべての投稿を非表示にします。また、クリックされたリージョンを覚えて、選択したリージョンでフィルタリングする方法も知っておく必要があります。

私のコードは今、私がうまく機能することができないたくさんの異なる解決策で混乱しています。カテゴリを「データカテゴリ」属性として適用してフィルタリングしようとしましたが、どこかで障害になりました。

助けてください、ありがとう！

4

1 に答える 1

2

まず、異なるクラスを相互に接続しない場合（つまり、「ニューススポーツ地域」の間にスペースを入れるだけ）に役立ちます。そうすれば、クラスの一部を選択するために複雑なこと（div [class * ='news-']など）を行う代わりに、クラスを1つの特定のクラス（「ニュース」または「スポーツ」）に適用できます。それを行うと、次のようになります。

<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があまり得意ではないので、これはその方法の概要のようなものです。うまくいけば、それはあなたが始められるようになります。

于 2012-10-09T20:57:40.157 に答える