图片预加载在Safari中工作但不在Chrome中

Question

我的目标是预加载数组中的图像，然后在单击按钮时立即显示随机图像。在下一次单击时，应显示阵列中的另一个随机图像。这是代码：

let randomImage = new Array(24);

function preload() {
    for (let x = 1; x < randomImage.length; x++) {
    randomImage[x] = "img/img" + x + ".jpg";
    }
    for (let i = 1; i < randomImage.length; ++i) {
    let img = new Image();
    img.src = randomImage[i];
    }
}

function randomImg() {
    let random = Math.floor(Math.random() * randomImage.length);
    if (random === 0) {
    return randomImage[1];
    }

document.getElementById("img_placeholder").src = randomImage[random];

}

这应该做的是首先用图像预加载数组（preload（）函数）。

每次按下按钮时都会调用randomImg（）函数。这适用于safari，但在chrome中它首先正确地预加载所有图像但是当我单击按钮转到下一个随机图像时它再次发送另一个获取请求来加载图像，选择在safari中它只需要加载图像。

我在这里做错了什么？

这是加载页面时的视图，图像也加载：

但是当按下更改为随机图片的按钮时，图像仍会再次加载：

这只适用于chrome，它适用于firefox和safari。