javascript - 似乎无法找到并切换已经扩展的类

Question

我发现以下代码与 Packery 结合使用，可以在点击时扩展和收缩 block 。我想在代码中添加这样的代码:当单击某个 block 时，当前展开的所有其他 block 都会缩小到其原始大小，因此此时只有 1 个 block 被展开。

这是代码

$( function() {
  var $container = $('.packery').packery();

  $container.on( 'click', '.item', function( event ) {
    var $item = $( event.currentTarget );
    var isExpanded = $item.hasClass('is-expanded');
    $item.toggleClass('is-expanded');
    if ( isExpanded ) {
      // if shrinking, just layout
      $container.packery();
    } else {
      // if expanding, fit it
      $container.packery( 'fit', event.currentTarget );
    }
  });
});

这是我找到的codepen http://codepen.io/anon/pen/myLbmP

我一直在尝试使用 .not 选择器，但我似乎无法重写它以使其正常工作。提前致谢

Answer 1

将代码更改为:

$( function() {
  var $container = $('.packery').packery();

  $container.on( 'click', '.item', function( event ) {
    var $item = $( event.currentTarget );
    var isExpanded = $item.hasClass('is-expanded');
    //NEW LINE BELOW
    $(".is-expanded").removeClass("is-expanded");
    if ( isExpanded ) {
      // if shrinking, just layout
      $container.packery();
    } else {
       $item.addClass('is-expanded');
      // if expanding, fit it
      $container.packery( 'fit', event.currentTarget );
    }
  });
});