javascript - 同位体フィルタリング - 結果なし

Question

ギャラリーを並べ替えるために適用できる 5 つの個別のフィルターを含むアイソトープ ギャラリーがあります。5 つのフィルターすべてを選択した場合、アイテムが表示されない可能性があります。

私がやりたいことは、フィルターが結果を返さない場合に非表示の div を表示することです。私は運がなければこれをやろうとしました。

アイソトープ ギャラリー フィルターがアイソトープ アイテムを表示しないほど具体的である場合、非表示の div を表示するにはどうすればよいですか?

Answer 1

この質問をした後、私は自分の解決策に出くわしました。この質問にあるのは、この回答とこの回答の組み合わせです。

探していることを行うために使用したコードは次のとおりです。

var $container = $('#container')
var selector = isoFilters.join('');
$container.isotope({ filter: selector }, function noResultsCheck() {
 var noItems = $('<div class="element no-results"> <!-- HTML for div to show "No Results" --> </div>');
 var yesItems = $('.no-results');
 var numItems = $('.element:not(.isotope-hidden)').length;
   if (numItems == 0) {
       $container.append(noItems).isotope( 'appended', noItems );
   }else{ 
       $container.isotope( 'remove', yesItems);
   }
});