Javascript 如何预加载图像以加快过渡

单击单选按钮时，我正在使用Javascript更改图像。当您第一次加载页面时，单击每个单选按钮后都会有一个延迟，然后它会平稳运行。我猜这是从它不加载图像，直到收音机被点击，我想知道是否有办法做到这一点。javascript如下所示：

<script type="text/javascript">


var switchingImage;
var productid;

function changeImage()
  {
    switchingImage.src = this.value;
    productId.value = this.alt;
  }


window.onload = function() {
var radios = document.getElementById('imageSwitcher').getElementsByTagName('input');
var products = document.getElementById('imageSwitcher').getElementsByTagName('alt');

switchingImage = document.getElementById('imageToSwitch');
productId = document.getElementById('productToSwitch');

for(var i=0;i<radios.length;i++)
{
    radios[i].onclick = changeImage;
}
}

</script>

var转换图像；
var-productid；
函数changeImage（）
{
switchingImage.src=this.value；
productId.value=this.alt；
}
window.onload=函数（）{
var radios=document.getElementById（'imageSwitcher'）.getElementsByTagName（'input'）；
var products=document.getElementById（'imageSwitcher'）.getElementsByTagName（'alt'）；
switchingImage=document.getElementById（'imageToSwitch'）；
productId=document.getElementById（'productToSwitch'）；
对于（var i=0；i预加载图像：

new Image().src = "path/to/file/image.png";

图像将被下载并存储在缓存中以供使用。
当然，只需创建一个图像数组，然后稍后引用它们。代码行
switchingImage.src=this.value；
将引用该数组。将预加载的图像放入数组时，确保使用
new
关键字。例如：

var preLoad = new Array();
var firstImage = new Image();
firstImage.src = "someLocation/thisImage.jpg";
preLoad.push(firstImage);

对所有图像执行此操作，然后引用数组
预加载[imageNumber]。src
用于
切换图像。src
是收集预加载图像的方式。
签出。