0

我知道您可以使用以下方法指定项目是否没有类:

if (!$(this).hasClass("test")) {

这很棒,但我无法确定在我的代码中使用它的位置。我正在使用 mixitup jQuery 插件进行过滤,并且在整个过程中都有一些 if 条件。我想说的是,如果没有一个兄弟姐妹$t('[data-filter="all"]具有“活动”类,则将活动类应用于$t并将变量 filterString 设置为“全部”。

我希望效果是,如果您删除所有过滤器,它会将其设置回默认的“全部”过滤器。见下文:

// INSTANTIATE MIXITUP

$('#equipment-grid').mixitup({
    //layoutMode: 'list', // Start in list mode (display: block) by default
    //listClass: 'list', // Container class for when in list mode
    //gridClass: 'grid', // Container class for when in grid mode
    effects: ['fade', 'blur'], // List of effects 
    //listEffects: ['fade','rotateX'] // List of effects ONLY for list mode
});

// HANDLE MULTI-DIMENSIONAL CHECKBOX FILTERING

/*  
 *  We can't used the default multiFilter because it
 *   behaves differently to what is required here.
 */

var $filters = $('#filters').find('li');
var filterString = 'all';

// Bind checkbox click handlers:

$filters.on('click', function () {
    var $t = $(this),
        filter = $t.attr('data-filter');

    if (filter == 'all') {
        // If "all"
        if (!$t.hasClass('active')) {
            // if unchecked, check "all" and uncheck all other active filters
            $t.addClass('active').siblings().removeClass('active');
            // Replace entire string with "all"
            filterString = 'all';
        }
    } else {
        // Else, uncheck "all"
        $t.siblings('[data-filter="all"]').removeClass('active');
        // Remove "all" from string
        filterString = filterString.replace('all', '');
        if (!$t.hasClass('active')) {
            // Check checkbox
            $t.addClass('active');
            // Append filter to string
            filterString = filterString == '' ? filter : filterString + ' ' + filter;
        } else {
            // Uncheck
            $t.removeClass('active');
            // Remove filter and preceeding space from string with RegEx
            var re = new RegExp('(\\s|^)' + filter);
            filterString = filterString.replace(re, '');
        };
    };

    /*
     *  We then send these strings to MixItUp using the filter method. We can send as
     *  many dimensions to MixitUp as we need using an array as the second argument
     *  of the "filter" method. Each dimension must be a space seperated string.
     */

    $('#equipment-grid').mixitup('filter', [filterString])
});
4

1 回答 1

1

像这样的东西?

// if we're left with nothing selected, check 'All' again
if ($filters.filter('.active').size() == 0) {
    $filters.filter('[data-filter="all"]').addClass('active');
    filterString = 'all';
}

这将在您完成所有其他复选框处理之后,但在您调用mixitup(). 所以就在您的评论块上方。

基本上,一旦我们完成了所有的处理,我们就会查看 中的所有元素$filters,如果没有匹配的.active,那么我们会找到all过滤器,并将活动类添加到其中。请注意,在这一点上,我们不在乎刚刚点击了哪一个。我们根本不在$t这里引用。

于 2013-06-06T06:44:39.340 回答