根据变量从数组中选择一个值

Question

基本上，我正在为我的网站创建一个预加载页面。我希望页面中间的图标每次访问者来到我的页面时都会更改。我需要选择数组中的变量或字符串。 我的代码：

$(document).ready(function() {
  //randomly pick a number an pick an icon to show on main page

  //Math.floor(Math.random() * 6) + 1 [from SOF]

  var min = 1,
    max = 8;

  var number = Math.floor(Math.random() * (max - min + 1) + min);

  var icons = ['preload/img/audio.svg', 'preload/img/bars.svg', 'preload/img/grid.svg', 'preload/img/oval.svg', 'preload/img/puff.svg', 'preload/img/rings.svg', 'preload/img/tail-spin.svg', 'preload/img/three-dots.svg'];

  alert(number);
});

我尝试过alert(icons.get(numbers));，但一直没有成功。我已经搜索了一段时间，但无法弄清楚原因。

- Josh Murray

---

哎，icons[number] 是选定源，但仍需要在图标上设置它，因此请同时发布 HTML。 - The Process

可能是从JavaScript数组中获取随机项的重复问题。 - Vanojx1

Answer 1

您需要使用index检索图标。

另外，对于random，它返回介于0和1之间的浮点数，因此作为数组基于0，并且您有8个项目，您需要：-

$(document).ready(function() {

  var number = Math.round(Math.random() * 7);

  var icons = ['preload/img/audio.svg', 'preload/img/bars.svg', 'preload/img/grid.svg', 'preload/img/oval.svg', 'preload/img/puff.svg', 'preload/img/rings.svg', 'preload/img/tail-spin.svg', 'preload/img/three-dots.svg'];

  alert(icons[number]);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

- BenG

---

啊哈，我曾在VB.NET中编写代码并使用数组索引，但我认为JavaScript和jQuery的工作方式不同。感谢您的帮助。 - Josh Murray

Answer 2

var icons = ['preload/img/audio.svg', 'preload/img/bars.svg', 'preload/img/grid.svg', 'preload/img/oval.svg', 'preload/img/puff.svg', 'preload/img/rings.svg', 'preload/img/tail-spin.svg', 'preload/img/three-dots.svg'];
var imageNum = Math.floor(Math.random()*icons.length);
document.getElementById("myIcon").src = icons[imageNum];

其中 "myIcon" 是你想要更改的图像的 id。

- jimboweb