我有一个图片库,它从文件夹 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);