功能周期中的随机显示项

Question

我有一个脚本，它循环在id=banner_1、id=banner_1、id=banner_3等标记中.

我想让我的脚本循环通过标签，但随机顺序，现在它们是按数字顺序(1,2,3等)循环。

HTML：

<p id='banner-1'>one</p>
<p id='banner-2'>two</p>
<p id='banner-3'>three</p>

jQuery：

<script type="text/javascript">     
    $(document).ready(function() {
        var divs = $('p[id^="banner-"]').hide(),
        i = 0;
        (function cycle() {
            divs.eq(i).fadeIn(400).delay(5000).fadeOut(400, cycle);
            i = ++i % divs.length;
        })();
    });
</script>

提前感谢！

Answer 1

这里有一个例子，它每次都会选择一个随机的横幅，但是不会显示相同的横幅两次。

(function cycle() {
    divs.eq(i).fadeIn(400).delay(3000).fadeOut(400, cycle);
    var old = i;
    while(old == i){
        i = (Math.random() * 100).toFixed(0) % divs.length;
    }

小提琴

另一个例子是，这将以随机顺序初始化横幅，并随后保持相同的模式(顺序)。

 var orderArray = []; 
 while(orderArray.length < divs.length){
        i = (Math.random() * 100).toFixed(0) % divs.length;
        if(orderArray.indexOf(i) == -1){
            orderArray.push(i);    
        }
    }
    i = 0;
(function cycle() {
    divs.eq(orderArray[i]).fadeIn(400).delay(2500).fadeOut(400, cycle);
    var old = i;
    while(old == i){
        i = (Math.random() * 100).toFixed(0) % divs.length;
    }

小提琴

取决于你想做什么。

Answer 2

只需将Math.random()添加到i中即可

i = (Math.random() * 100).toFixed(0) % divs.length;

小提琴