1

我有一小段 Javascript，我在其中按顺序从头到尾轮换引用列表。

但是，我想随机浏览列表（而不是按顺序），不重复，直到所有引号都被迭代，然后再次从随机引号开始。我该怎么做呢？

$(function(){
    var quotes = $('#quotes').children('.rotate-quote');
    firstQuo = quotes.filter(':first');
    lastQuo = quotes.filter(':last');
    quotes.first().show();
    setInterval(function(){
        if($(lastQuo).is(':visible')) {
            var nextElem = $(firstQuo);
        } else {
            var nextElem = $(quotes).filter(':visible').next();
        }
        $(quotes).filter(':visible').fadeOut(300);
        if($(lastQuo).is(':visible')) {
            setTimeout(function() {
                $(firstQuo).fadeIn(300);
            }, 600);

        } else {
            setTimeout(function() {
                $(nextElem).fadeIn(600);
            }, 600);
        }
    }, 10000);
});
4

4 回答 4

2

这是一个可能的演示解决方案：

var $container = $('div'),
    quotes = $('quote').hide().toArray(),
    delay = 500;

function shuffle(arr) {
  return arr.map(function(v){ return [v,Math.random()]; })
    .sort().map(function(v){ return v[0]; });
}

function loop() {
  $(shuffle(quotes)).each(function(i,el) {
    setTimeout(function(){ $(el).appendTo($container).show(); }, i*delay);
  });
}

function start() {
  function begin(){ $(quotes).hide(); loop(); }
  setInterval(begin, quotes.length * delay);
  begin();
}

start();

演示：http: //jsbin.com/agihix/1/edit

编辑：我把它变成了一个小插件，在这里获取它https://gist.github.com/elclanrs/5610886

于 2013-05-20T05:32:08.220 回答
0

下面复制引用数组，然后每次随机从中切出一个。wWen 没有留下任何条目，它会重新开始。

var randomQuote = (function() {
  var quotes = ['quote 0','quote 1','quote 2'];
  var quoteCopy = [];

  return function () {
    if (!quoteCopy.length) {
      quoteCopy = quotes.slice();
    }
    return quoteCopy.splice(Math.random()*quoteCopy.length | 0, 1)[0];
  }
}());
于 2013-05-20T05:43:44.893 回答
0

I don't think your algorithm as stated is good. Suppose you have 100 quotes and then you make a first random presentation of the full set.

At the end, as stated in your description, will start again from scratch and so it's possible that quote 101 will be the same quote as 100.

I think that something better (more uniform) would be

  1. Randomly shuffle the n quotes. This is done only once at the beginning.
  2. Pick the first quote and display it.
  3. Remove the quote from the list and insert it in a random position between n-w and n where w is a parameter (e.g. n/2).
  4. Repeat from 2 for each quote you need.

The number w will modulate how much random you want the sequence to be... the smaller and the more uniform the delay will be after a quote is presented.

With this approach there will be no "distribution glitch" and the average delay after which a quote is presented next time will not depend on the current position.

于 2013-05-20T05:53:11.257 回答
0

只是为了展示Fisher Yates（不是我的代码）：

function fisherYates ( myArray ) {
  var i = myArray.length, j, temp;
  if ( i === 0 ) return false;
  while ( --i ) {
     j = Math.floor( Math.random() * ( i + 1 ) );
     temp = myArray[i];
     myArray[i] = myArray[j]; 
     myArray[j] = temp;
  }
  return myArray;
}

因此，将您的引号放入一个数组中，通过该函数运行它，然后遍历该数组，当您到达末尾时，再次通过该函数运行它，等等。

于 2013-05-20T05:12:46.740 回答