• User Attivo

    Puoi usare la funzione nth-child. Ti consente di identificare numericamente un tag.

    
    var quantita = $(".servizi li").length;
    var casuale = Math.floor(Math.random()*quantita) + 1;
    $(".servizi li:nth-child(" + casuale + ")").show();
    
    

    ovviamente, per default nel css li devi nascondere tutti preventivamente. Quindi

    .servizi li { display: none }
    

  • Super User

    Grazie Francesco, questo è il secondo aiuto importante che mi dai!
    Provo e ti do conferma.
    Quindi io devo mettere il valore numero al posto della voce 'quantita'?

    Grazie.


  • User Attivo

    @felino said:

    Quindi io devo mettere il valore numero al posto della voce 'quantita'?

    No no, devi solo copia-incollare le istruzioni che ti ho dato nei fogli JS/CSS. La variabile quantità è assegnata per prima perché il numero casuale deve essere di un valore massimo pari al numero di LI presenti.


  • Super User

    Scusami, ma come indico gli elementi da visualizzare? Cioè, se ad esempio sono 3 o 4?


  • User Attivo

    @felino said:

    Scusami, ma come indico gli elementi da visualizzare? Cioè, se ad esempio sono 3 o 4?

    Quanti "li" hai nella classe .servizi lo stabilisce la prima istruzione e memorizza in quantita. Il casuale da visualizzare è calcolato dalla seconda istruzione. "casuale" è un numero compreso tra 1 e quantita. Dopodiché la nth-child si occupa di mostrare il LI che corrispondente nell'ordine al numero casuale.


  • Super User

    Scusami Francesco, forse non mi sono spiegato, se nel mio ul ho 5 li ed io ne voglio visualizzare solo 3 per volta in maniera random, come dovrei fare?

    Grazie.


  • User Attivo

    @felino said:

    Scusami Francesco, forse non mi sono spiegato, se nel mio ul ho 5 li ed io ne voglio visualizzare solo 3 per volta in maniera random, come dovrei fare?

    Avevo capito che volevi estrarne uno casuale, non più di uno... 😄

    
    var num_davisualizzare = 3;
    var davisualizzare = Array();
    var visualizzati = 0;
    var casuale = 0;
    var quantita = $(".servizi li").length;
    if (num_davisualizzare <= quantita) num_davisualizzare = quantita;
    while (visualizzati <= num_davisualizzare) {
        casuale = Math.floor(Math.random()*quantita) + 1;
        if (!$.inArray(casuale, davisualizzare)) {
            davisualizzare.push(casuale);
            $(".servizi li:nth-child(" + casuale + ")").show();
            visualizzati++;
        }        
    }
    
    

    La variabile num_davisualizzare rappresenta il numero dei LI che vuoi visualizzare. Ovviamente se metti un valore superiore ai LI che hai, li visualizza tutti. La funzione push() serve per inserire un valore all'interno di un array. Ogni volta che genero un casuale verifico che non sia già nell'array, cioè che non sia stato già visualizzato.


  • Super User

    Francesco,
    non so se sia una casualità oppure no, ma appena inserito il tuo codice Firefox mi da il seguente messaggio di errore:

    "Uno script in questa pagina potrebbe essere occupato o aver smesso di rispondere. È possibile fermare lo script adesso o attendere per vedere se lo script conclude la sua esecuzione.

    Script: ajax.googleapis . com /ajax/libs/jquery/1.8/jquery.min.js:2"

    😐


  • Super User

    Ho provato ad usare questo codice per la generazione di elementi casuali compresi da 1 e 5:

    
    jQuery.extend({
            rand: function(val) {
                return Math.floor(val * (Math.random() % 1));
            },
            randComp: function(min, max) {
              min = Math.floor(min);
              max = Math.floor(max);
    		  var boo = jQuery.rand(max-min);
              return min + boo;
            }
    }); 
    
    

    funziona correttamente, ma come faccio ad evitare che vengano visualizzati gli elementi doppioni?

    Cioè se viene generato il numero 1, quando richiamo nuovamente la funziona il numero 1 non deve essere più generato.


  • User Attivo

    Avevo sbagliato delle istruzioni. Ora funziona.

    
    $(document).ready(function() {
        var num_davisualizzare = 3;
        var davisualizzare = Array();
        var visualizzati = 0;
        var casuale = 0;
        var quantita = $(".servizi li").length;
        if (num_davisualizzare > quantita) num_davisualizzare = quantita;
        while (visualizzati <= num_davisualizzare) {
            casuale = Math.floor(Math.random() * quantita) + 1;
            if (($.inArray(casuale, davisualizzare)) == -1) {
                davisualizzare.push(casuale);
                $(".servizi li:nth-child(" + casuale + ")").show();
                visualizzati = visualizzati+1;
            }
        }
    });
    
    

  • Super User

    Grazie, funziona correttamente.
    Nel tempo ho creato anche una soluzione in PHP:

    
    $numbers = range(1, 5);
    shuffle($numbers);
    echo '<script>';
    	for ($i=1 ; $i <= 4 ; $i++){ ?>
    	$('.box_room_<?php echo $numbers*; ?>').show();
    <?php } 
    echo '</script>';
    
    
    
    1. Genero 5 numeri casuali e li mettto in un array
    2. inverto l'ordine in maniera casuale con shuffle
    3. ne estraggo solo 4 su 5;
    4. con jquery mostro il relativo id.

    Che ne dite?