Javascript 为自动淡入和淡出选择随机div

目前，该代码是自动淡入淡出div，方法是按排列方式（连续顺序）选择div元素。我现在想做的是使选择器随机，我想在一个随机div中淡出，淡出后，它将选择另一个随机div并无限循环这个过程。因为我是jQuery新手，所以很困惑，我也想知道您对如何以最简单的方式将这个过程放到If-Else语句中的看法。例如，我将得到一个数字的值

int num = 1;
If(num == 1){
<!-- Do the process-->
}
Else {
<!-- Do another process by selecting from another set of divs-->
}

分区：

1-----------一
二-----------二
三-----------三

尝试将nextOrFirst函数更改为类似以下内容：

   jQuery.fn.nextOrFirst = function (selector) {
    var xCount = selector.size();   
    return  Math.floor(Math.random() * xCount ) + 1;
}

不是得到第一个div的下一个，而是得到所有div的计数，

---

图片是一个介于1和X之间的随机数（使用选择器的div数）

试试这样的方法，希望能有所帮助

     var c=$(".boxes div");
     setInterval(function(){

     $.each(c,function(a,z){
          $("div[class='"+(z.className)+"'").fadeIn();
     });

      var item = c[Math.floor(Math.random()*c.length)];
      var u=item.className;

      $("."+u).fadeOut();
      $("div[class='"+u+"'").fadeOut(1000);

   }, 3000);

编辑：

var c=$(".boxes div");
 setInterval(function(){
 $.each(c,function(a,z){
    $("div[class='"+(z.className)+"'").hide();
 });
 var item = c[Math.floor(Math.random()*c.length)];
 var u=item.className;
 $("."+u).fadeOut();
 $("div[class='"+u+"'").show().fadeIn(1000);

 }, 2000);

---

小提琴链接：

不确定这是否正是您想要的，但可以修改：

var mb = $('.mb'),   
mbl = mb.length;

mb.hide();
rand();

function rand(){
  var r = getRand(0, mbl);

  mb.eq(r).fadeIn('slow', function(){
    $(this).fadeOut('slow', function(){
      setTimeout(rand, 200);
    });
  });
}


function getRand(min, max) {
    return Math.floor(Math.random() * (max - min) + min);
}

---

我理解你的观点，但它不能与上面的代码一起工作，你能在这里给我一个例子吗？它只显示1个div，不再显示了。有什么更新吗？这一个有效，但它显示了所有的div元素。如何一次只显示一个div？在下一个div淡入前设置一个间隔？@vnylng检查答案，我已经更新了它和fiddle链接。如果你发现任何答案有用，也给答案打分！当存在另一个div元素时，代码工作不正常，只需更改我以前代码的选择器可能会更好。我以前的代码工作正常，但我的问题是如何使选择器随机。你有什么想法吗，先生？@vnylng好的，我可以这样做，但是你能告诉我什么在我编辑的代码中不起作用吗，因为我在小提琴中添加了第四个div，它工作得很好。现在工作得很好。无论如何，我怎样才能为你的新更新添加间隔？我希望它淡入4秒钟，在显示下一个随机div之前再间隔4秒钟。嗨，Tom，每次我在JSFIDLE尝试这个方法时，它都可以正常工作，但当我将它传输到html文件时，它就不起作用了。我觉得很奇怪，或者我错过了什么。你能帮我吗？试着用$（document）.ready（function（）{}）包装整个文档；我是jQuery新手，多亏了你，现在我知道我必须在它工作之前包装它。现在它运行平稳！

var c=$(".boxes div");
 setInterval(function(){
 $.each(c,function(a,z){
    $("div[class='"+(z.className)+"'").hide();
 });
 var item = c[Math.floor(Math.random()*c.length)];
 var u=item.className;
 $("."+u).fadeOut();
 $("div[class='"+u+"'").show().fadeIn(1000);

 }, 2000);

var mb = $('.mb'),   
mbl = mb.length;

mb.hide();
rand();

function rand(){
  var r = getRand(0, mbl);

  mb.eq(r).fadeIn('slow', function(){
    $(this).fadeOut('slow', function(){
      setTimeout(rand, 200);
    });
  });
}


function getRand(min, max) {
    return Math.floor(Math.random() * (max - min) + min);
}