Question

我无法过滤一些列表元素给出一个特定的类我的网站右上角有四个类别， CMS，编程，设计，所有项目

给出

 <div class = "container">
                <h1 id = "heading">All Projects</h1>
                <ul id = "gallery">

                    <li class = "design"><a href = "#"><img src = "img/web1.jpg"></a></li>
                    <li class = "design programming"><a href = "#"><img src = "img/web2.jpg"></a></li>
                    <li class = "cms"><a href = "#"><img src = "img/web3.jpg"></a></li>
                    <li class = "cms design"><a href = "#"><img src = "img/web4.jpg"></a></li>
                    <li class = "programming"><a href = "#"><img src = "img/web5.jpg"></a></li>
                    <li class = "design"><a href = "#"><img src = "img/web6.jpg"></a></li>
                    <li class = "design"><a href = "#"><img src = "img/web10.jpg"></a></li>
                    <li class = "cms design"><a href = "#"><img src = "img/web11.jpg"></a></li>

                </ul>

我正在通过

过滤它们

$(document).ready(function(){
    $('nav a').on('click',function(){

        //current class assignment
        $('nav li.current').removeClass('current');
        $(this).parent().addClass('current');

        //set Heading text

        $('h1#heading').text($(this).text());

        // get and filter text

        var category = $(this).text().toLowerCase().replace(' ','-');

        //remove hidden class if 'all-projects' is selected

        if(category == "all-projects"){
            $('ul#gallery li:hidden').fadeIn('slow').removeClass('hidden');
        } else{

            $('ul#gallery li').each(function(){

                if(!$(this).hasClass(category))
                    {
                        $(this).hide().addClass('hidden');
                    }
                else{
                    $(this).fadeIn('slow').removeClass('hidden');
                }

            });
        }
        //stop link from behaviour
        return false;


    });
});

我的想法

我的初步计划基本上是遍历每个类，并检查它们是否匹配的大小写或连字符。我会给那些与标签没有相同类的东西一个隐藏的类，显然隐藏它们。我的逻辑在哪里错了？

经过大量测试后，我也意识到它隐藏了每一堂课。不知道为什么会发生这种情况，即使我用过滤器测试它。

按类名过滤类别

0 个答案: