如何在jQuery中随机化.hasClass()中的.class名称

Question

我有一个代码:

$(".user-items").each(function() {
  if ($(this).hasClass("don't know the code yet")) {
    $(this).fadeIn();
  } else {
    $(this).fadeOut();
  }
});

但我希望它像这样工作:

$(".user-items").each(function() {
  if ($(this).hasClass(".people OR .photos OR .videos")) {
    $(this).fadeIn();
  } else {
    $(this).fadeOut();
  }
});

我想在每个循环中随机化3个类.each(),并使所有匹配的元素fadeIn/fadeOut

注意*:里面的"OR" .hasClass只是对我希望它如何工作的解释

<a href="javascript:void(0);" class="user-items people">People</a>

<a href="javascript:void(0);" class="user-items photos">Photo</a>

<a href="javascript:void(0);" class="user-items videos">Videos</a>
...
...
...
lots of more .user-items classes with 3 given classes: .people, .photos, .videos

谢谢

Answer 1

您可以使用类数组然后random()方法来获取每次随机类,如:

var classes = ['photos', 'videos', 'people'];

$(".user-items").each(function() {
  var random_class = classes[Math.floor((Math.random() * classes.length) + 0)];

  console.log(random_class);

  if ($(this).hasClass(random_class)) {
    $(this).fadeIn();
  } else {
    $(this).fadeOut();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="javascript:void(0);" class="user-items people">People</a>
<br>
<a href="javascript:void(0);" class="user-items photos">Photo</a>
<br>
<a href="javascript:void(0);" class="user-items videos">Videos</a>