我有一个同位素画廊,其中包含五个单独的过滤器,可用于对画廊进行排序。如果一个人要选择所有五个过滤器,则可能会导致不显示任何项目。
如果过滤器不返回结果,我想做的是显示一个隐藏的 div。我已经考虑过在没有任何运气的情况下尝试这样做。
如果同位素库过滤器足够具体而无法显示任何同位素项目,我如何显示隐藏的 div?
我有一个同位素画廊,其中包含五个单独的过滤器,可用于对画廊进行排序。如果一个人要选择所有五个过滤器,则可能会导致不显示任何项目。
如果过滤器不返回结果,我想做的是显示一个隐藏的 div。我已经考虑过在没有任何运气的情况下尝试这样做。
如果同位素库过滤器足够具体而无法显示任何同位素项目,我如何显示隐藏的 div?
在问了这个问题后,我遇到了我的解决方案。这是这个答案和在这个问题中找到的这个答案的组合。
这是我用来做我正在寻找的代码:
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);
}
});