Question

它的作用：

一旦选中了标签，它就会获得它的课程并仅显示ul.portfolio > li 具有此类的元素

   $('.portfolio-filter li a').click(function() {


    $('.portfolio-filter > .selected').prop('class','');
    $(this).parent('li').addClass('selected');

    var FilterClass = $(this).attr('class');

    $('#portfolio-items li').hide();
    $('#portfolio-items li.' + FilterClass).show();
    $('#portfolio-items').CreateTabs();

});

然后运行CreateTabs函数 - 在底部创建分页
问题是 <li class="all website"></li>的最后一个元素上没有'logo'类，但是如果你选择了标签LOGO，它会显示出来./

为什么呢？任何建议都非常感谢！

Answer 1

问题出在CreateTabs和Pagination函数中。

以下是CreateTabs的解决方案：

$.fn.CreateTabs = function(filterClass){

        var CoundNumberOfDivs = $('#portfolio-items li:visible').length;
        $('.pagination li a').hide();
        if( CoundNumberOfDivs <= 4 ) {
            return false;
        }
        else {
            var num = Math.ceil(CoundNumberOfDivs / 4);
            $('.pagination li a:lt(' + num + ')').show();
            $('#portfolio-items li').hide();
            if (filterClass === undefined) {
                $('#portfolio-items li:lt(4)').show();
            } else {
                $('#portfolio-items li.' + filterClass + ':lt(4)').show();
            }
        }

    };
})(jQuery);

如果您删除前四个元素之一的logo类，您将看到过滤器有效。现在，分页仍然会出现问题......所以这是一个解决方案。

var filterClass;

$('.portfolio-filter li a').click(function() {


    $('.portfolio-filter > .selected').prop('class','');
    $(this).parent('li').addClass('selected');

    filterClass = $(this).attr('class');

    $('#portfolio-items li').hide();
    $('#portfolio-items li.' + filterClass).show();
    $('#portfolio-items').CreateTabs(filterClass);

});

$('ul.pagination li a').click(function(event) {
        $('ul.pagination li .active').removeClass('active');
        $(this).addClass('active');

    var PI = $('#portfolio-items li' + (filterClass !== undefined) ? '.' + filterClass : '');
        $('#portfolio-items li').hide();
    .....

部分

        if ($(this).hasClass('href-1')) {
            PI.slice(0, 4).show();
        }
        .... etc

必须改写 - 坦率地说，这很糟糕。

Answer 2

我完全不明白，但我认为问题出现在你的分页功能中，因为只有当你切换到第3页时才显示最后的LI元素，对吗？看这个： - 全部点击 - 点击第3页 - 点击“徽标” -Observe -Result：继续选择数字3，并更改分页顺序，如果单击第2页，结果将高于第3页中的结果。

jQuery函数 - 意外行为

2 个答案: