visualizza in modo casuale una classe div utilizzando JQuery

Question

Desidero visualizzare in modo casuale una classe div utilizzando JQuery. Il codice è qualcosa di simile:

<div class="item">One</div> 
<div class="item">Two</div> 
<div class="item">Three</div> 
<div class="item">Four</div> 

Quindi, se il metodo casuale (risultato casuale è all'interno di 1 a 4) dà 3 come risultato, si vede:

<div class="item">Three</div> 

Il resto sono nascosti. Ovviamente, il codice può essere modificato per farlo funzionare. Grazie.

Answer 1

var number = Math.floor(Math.random()*3) 
var div = $(".item")[number]; 
div.show(); 

Answer 2

Qualcosa del genere:

$('.item').hide().eq(Math.floor(Math.random()*4)).show() 

Fiddle: http://jsfiddle.net/PPXmE/

Answer 3

In primo luogo abbiamo un int a caso, da zero al numero di elementi (meno 1). Quindi nascondiamo tutti gli altri elementi e mostriamo solo quello scelto a caso.

var random = Math.floor(Math.random() * jQuery('.item').length); 
jQuery('.item').hide().eq(random).show(); 

Demo

Answer 4

esempio di lavoro: jsFiddle

js

window.onload=function() { 
    var E = document.getElementsByClassName("item"); 
    var m = E.length; 
    var n = parseInt(Math.random()*m); 
    for (var i=m-1;i>=0;i--) { 
     var e = E[i]; 
     e.style.display='none'; 
    } 
    E[n].style.display=''; 
} 

js.minified

window.onload=function(){var E=document.getElementsByClassName("item");var m=E.length;var n=parseInt(Math.random()*m);for(var i=m-1;i>=0;i--){var e=E[i];e.style.display='none';}E[n].style.display='';} 

html

<div class="item">One</div> 
<div class="item">Two</div> 
<div class="item">Three</div> 
<div class="item">Four</div> 
<div class="item">Five</div> 
<div class="item">Six</div> 
<!-- Add as many as you want! //-->