Question

我有以下内容并且无效。重点是每次浏览器刷新时随机显示以下4个图像中的任何一个。有什么帮助吗？

https://jsfiddle.net/benjones337/690zc6h8/

HTML：

<p>
  <img id="image" />
</p>

JS：

function Randomize() {
  var images = ["http://static.ddmcdn.com/gif/lightning-gallery-18.jpg",
              "http://static.ddmcdn.com/gif/lightning-gallery-19.jpg",
              "http://static.ddmcdn.com/gif/lightning-gallery-20.jpg",
              "http://static.ddmcdn.com/gif/lightning-gallery-17.jpg"];

  var imageNum = Math.floor(Math.random() * images.length);
  document.getElementById("divid").style.backgroundImage = "url('" + images[imageNum] + "')";
}

window.onload = Randomize;

Answer 1

首先：您需要一个ID为divid的div。

第二：jsfiddle以https加载，图片加载为http，因此浏览器不允许。

第三：jsfiddle已经运行onload - 所以你的代码不会运行。

第四：我在div中添加了一些css，以便显示背景图像。

试试这个：https://jsfiddle.net/maniator/2nxm19fh/

function Randomize() {
  var images = [
    "//static.ddmcdn.com/gif/lightning-gallery-18.jpg",
    "//static.ddmcdn.com/gif/lightning-gallery-19.jpg",
    "//static.ddmcdn.com/gif/lightning-gallery-20.jpg",
    "//static.ddmcdn.com/gif/lightning-gallery-17.jpg"
  ];
  var imageNum = Math.floor(Math.random() * images.length);
  document.getElementById("divid").style.backgroundImage = "url('" + images[imageNum] + "')";
}

Randomize();

随机图像选择

1 个答案: