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