0

私のページには次のものがあります。JavaScriptを使用して整理する必要があります。

<li class="cat2 lang1">Hello</li>
<li class="cat2 lang1">Hello</li>
<li class="cat1 lang2">Hello</li>
<li class="cat3 lang3">Hello</li>

私が試したのは：

$('#movieFeatureFilter span#selGenre .subMenus li').click(function()
{
    if(this.id != '')
    {
        $('.movie_lists ul li').hide();
        $('.movie_lists ul li.cat'+this.id).show();
    }
    else $('.movie_lists ul li').show();
});

これは完璧に機能します。しかし、langとcatの組み合わせを使用してリストをソートする必要があります。

つまり、cat1をカテゴリとして選択し、lang2を言語として選択すると、3 番目のliが表示される場合があります。

私はあなたが私が意味するものを得たと思います。悪い説明でごめんなさい。助けてください

4

2 に答える 2

2 
var $items = $('ul li'), $cat = $('#cat'), $lang = $('#lang');
$('#cat, #lang').change(function(){
    var cat = $cat.val(), lang = $lang.val(), $filtered = $items;
    if(cat){
        $filtered = $filtered.filter('.' + cat);
    }
    if(lang){
        $filtered = $filtered.filter('.' + lang);
    }
    $items.not($filtered).hide();
    $filtered.show()
})

デモ:フィドル

于 2013-09-16T02:29:38.627 に答える
0

並べ替えの代わりに、 catとlangの選択に基づいてアイテムを表示/非表示にしたいようです。次の関数はあなたの目的に役立ちます：

$("#movieFeatureFilter span#selGenre .subMenus li").click(function () {

   /*GET cat AND lang FROM DROPDOWNS*/

    var cat = $("#c").val(),
        lng = $("#l").val();

    $("#<ID OF UL> li").filter(function () {
        $this = $(this);
        if ($this.hasClass(cat)) {
            if (!$this.hasClass(lng)) {
                $this.hide();
            } else {
                $this.show();
            }
        } else {
            $this.hide();
        }
    });
});

ここでフィドルをチェックインします。

于 2013-09-16T02:20:01.523 に答える