时间戳

首页 > 解决方案 > 如何使用javascript使随机图像可点击到专用页面？

javascript - 如何使用javascript使随机图像可点击到专用页面？

问题描述

我已经尝试修复这个问题好几天了，但无法让它工作，我需要我的 JavaScript 代码中的图像有自己的链接到我网站上的另一个页面（即index1.html，，，，index2.html）index3.html

用户生成一个随机图像，当图像出现时，他们可以单击该图像并转到该图像链接到的特定页面。

那有意义吗？

function getRandomImage() {
  //declare an array to store the images
  var randomImage = new Array();

  //insert the URL of images in array
  randomImage[1] =  "frames/1.png";  //this needs to have a link
  randomImage[2] =  "frames/2.png";  //this needs to have a link
  randomImage[3] =  "frames/3.png";  //this needs to have a link
  randomImage[4] =  "frames/4.png";  //this needs to have a link
  randomImage[5] =  "frames/5.png";  //this needs to have a link
  randomImage[6] =  "frames/6.png";  //this needs to have a link
  randomImage[7] =  "frames/7.png";  //this needs to have a link
  randomImage[8] =  "frames/8.png";  //this needs to have a link
  randomImage[9] =  "frames/9.png";  //this needs to have a link
  randomImage[10] = "frames/10.png"; //this needs to have a link

  //loop to display five randomly chosen images at once
  for (let i = 0; i < 1; i++) {
    //generate a number and provide to the image to generate randomly
    var number = Math.floor(Math.random() * randomImage.length);

    //print the images generated by a random number
    document.getElementById("result").innerHTML += '<a href="' + randomImage[number] + '"><img src="' + randomImage[number] + '" style="width:450px" /></a>';
  }
}
<button onclick="getRandomImage()">Show Image</button>
<div class="container">
  <span id="result" align="center"></span>
</div>

标签： javascripthtml

解决方案

您是否尝试在数组中使用对象？我举个例子：


function getRandomImage() {  
    //declare an array to store the images  
    var randomImage = new Array();  
      
    //insert the URL of images in array  
    randomImage[0] =  {img: "frames/1.png", url:"index1.html"};
    randomImage[1] =  {img: "frames/2.png", url:"index2.html"};
    randomImage[2] =  {img: "frames/3.png", url:"index3.html"};
    
    var number = Math.floor(Math.random()*randomImage.length);

    let a = document.createElement("a")
    a.href = randomImage[number].url

    let img = document.createElement("img")
    img.src = randomImage[number].img
    img.style.width = "450px"

    a.append(img)

    document.getElementById("result").append(a)
}

而且更干净。当您已经创建了随机数生成器时，我真的不明白 for 循环..

推荐阅读