Javascript / JQuery 随机图像重复问题

Question

我有一个图片库，可以从文件夹 images/flip_images/ 中提取随机图片。这些文件的名称是数字，然后是 .jpg，例如0.jpg, 1.jpg 等。有 14 张图片可供选择，标记为 0 - 13。由于只有 14 张图片，页面一次需要 4 张图片，所以有很多重复，我会喜欢避免。我正在使用 Javascript 生成随机图像文件名并将变量传递给 JQuery .flip() 命令。

我尝试在下面的代码中使用 do while 循环来更改全局变量，将全局变量与其他变量进行比较，如果它首先选择的数字已经在使用中，则选择另一个数字。但是，我似乎无法让它发挥作用。这是范围问题还是我只是在代码中犯了一个简单的错误？代码如下：

var randomNumber0= 0;
var randomNumber1= 1;
var randomNumber2= 2;
var randomNumber3= 3;

var refreshId0 = setInterval(function(){

    var $this = $(this);

    do {

        randomNumber0=Math.floor(Math.random()*14)

    }while(randomNumber0 == randomNumber1 || randomNumber0 == randomNumber2 || randomNumber0 == randomNumber3){

        randomNumber0=Math.floor(Math.random()*14)

    };

    $("#flipboxa").flip({       
        direction: 'lr',
        color: "transparent",
        content: '<img src="images/flip_images/'+randomNumber0+'.jpg" width="120" height="275" alt="alt tag here" />',
    });

    return false;

}, 5000);

var refreshId1 = setInterval(function(){

    var $this = $(this);

    do {

        randomNumber1=Math.floor(Math.random()*14)

    }while(randomNumber1 == randomNumber0 || randomNumber1 == randomNumber2 || randomNumber1 == randomNumber3){

        randomNumber1=Math.floor(Math.random()*14)

    };  

    $("#flipboxb").flip({       
        direction: 'rl',
        color: "transparent",
        content: '<img src="images/flip_images/'+randomNumber1+'.jpg" width="120" height="275"  alt="alt tag here" />',
    });

    return false;

}, 6000);

var refreshId2 = setInterval(function(){

    var $this = $(this);

    do {

        randomNumber2=Math.floor(Math.random()*14)

    }while(randomNumber2 == randomNumber0 || randomNumber2 == randomNumber1 || randomNumber2 == randomNumber3){

        randomNumber2=Math.floor(Math.random()*14)

    };

    $("#flipboxc").flip({       
        direction: 'lr',
        color: "transparent",
        content: '<img src="images/flip_images/'+randomNumber2+'.jpg" width="120" height="275" alt="alt tag here" />',
    });

    return false;

}, 7000);

var refreshId3 = setInterval(function(){

    var $this = $(this);

    do {

        randomNumber3=Math.floor(Math.random()*14)

    }while(randomNumber3 == randomNumber0 || randomNumber3 == randomNumber1 || randomNumber3 == randomNumber2){

        randomNumber3=Math.floor(Math.random()*14)

    };  

    $("#flipboxd").flip({       
        direction: 'rl',
        color: "transparent",
        content: '<img src="images/flip_images/'+randomNumber3+'.jpg" width="120" height="275"  alt="alt tag here" />',
    });

    return false;

}, 8000);

Answer 1

这不是do..while的正确形式

do {

    //something

}while(...){

    //something else

};  

试试这样：

do {
    //something
}
while(...);