javascript根据条件显示或隐藏类

Question

在此网站中:website

当您向下滚动到徽章部分时，

我有两个徽章条件:(下面是两个徽章)

问题:

当计数(在徽章右上角显示为“10”和“0”)大于“0”时，应显示“已解锁并带有复选标记”，否则应显示“已锁定并带有十字”被显示并且它应该像我们通常看到的悬停效果一样褪色。

社区中建议的 javascript :(在带有评论的 html 部分的 fiddle 中)

$.each($('.Portfolio-box'), function() {
  var count = $(this).children('has-badge').attr('data-count');
  if (data - count > 0) {
    $(this).children('ul.locked').hide();
    $(this).children('ul.unlocked').show();
  } else {
    $(this).children('ul.locked').show();
    $(this).children('ul.unlocked').hide();
  }
});

Fiddle 链接与 html 和 css。请忽略图像或正确对齐。代码“锁定和解锁”部分的更改完美无缺。

链接:https://jsfiddle.net/dkjz1z4k/

这对我来说很棘手。请帮助，如果有人可以。非常感谢。上帝保佑。

Answer 1

差不多了，只是对条件 if (count > 0) & .has-badge 做了一点调整

$.each($('.Portfolio-box'), function() {
  var count = $(this).children('.has-badge').attr('data-count');
  if (count > 0) {
    $(this).children('ul.locked').hide();
    $(this).children('ul.unlocked').show();
  } else {
    $(this).children('ul.locked').show();
    $(this).children('ul.unlocked').hide();
  }
});

Working Fiddle