Question

我已经创建了一个脚本来填充一个数字从0到18的数组，并使用一个函数来重新排列它。

例如：

var Arr = new Array ();

for (var i = 0; i < 119; i++) {
    Arr[i] = i;
}

function shuffle(o){ 
    for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
    return o;
};

newArray = shuffle(Arr);

我有一个有24个拇指的画廊，名为0.jpg，1.jpg等118.jpg。我需要从一个数组中为每个拇指调用一个数字。

php中的等价物是：

<?php $arr = array_rand(range(1, 117), 24);?>
<img src="images/<?php echo $arr[0].'.jpg'; ?>" />

这可以在Javascript中完成吗？我该怎么办呢？使用拇指名称创建数组是不切实际的。

Answer 1

我设法这样做（来自同事的帮助）：

var array           = [];   // create array for the images

for (var i = 0; i < 90; i++) {
    array[i] = i;
}

var new_array       = shuffle(array);   // shuffled array

for (var i = 1; i <= 24 ; i++) {
    $('#' + i).attr('src', 'images/banner/' + new_array[i-1] + '.jpg');
}

window.setInterval(function(){
    var random_position = Math.floor(Math.random() * 24) + 1;   // grab a random position from the grid
    var random_image    = Math.floor(Math.random() * array.length) + 0; // grab a random image

    while ($.inArray(random_image, new_array.slice(0, 24)) > -1) {  // condition to avoid duplicate images
        random_image    = Math.floor(Math.random() * array.length) + 0;
    }

    $('#' + random_position).fadeOut(300, function() {  // change image
        $('#' + random_position).attr('src', 'images/banner/' + random_image + '.jpg');
        $('#' + random_position).fadeIn(300);
    });

    new_array[random_position - 1] = random_image;  // register the change

    return false;

}, 5000);

function shuffle(o){ //  shuffle function
for (var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
return o;};

Answer 2

你可以给图像一个类并做

$(".imageClass").each(function(i) {
 this.src="/images/"+newArray[i]+".jpg";
});

从填充的数组中更改img src

2 个答案: