Question

我需要创建一个用户可以访问输入问题的功能，他们可以看到不同的结果。这是一个神奇的八球模拟。我需要使用数组，但我不知道如何使用图像。

这就是我现在所拥有的。

function eightBall() {
            var answer = document.getElementById('questBox').value;
            answer = answer.toLowerCase();

            if (answer.search(/[?]/) > -1) {
                var no = '../images/eightBallNo.png';
                $('#answerImages').html(no);
            }
        }

我不知道该怎么做，所以任何帮助都会受到赞赏。另外，我需要这样做，以便当用户输入相同的问题时，它总是返回相同的结果。我的指示是通过if语句来做到这一点。再次，任何帮助将不胜感激。

Answer 1

使用对象创建地图，并将每个问题及其中的随机图像存储在其中。当某人提出问题时，请检查您是否已将该问题映射到某个问题。如果是这样，请使用缓存的结果。如果没有，从阵列中获取一个随机图像，然后将其添加到缓存中：

// empty cache to use
var answerMap = {}
// array of your images
var images = ['image_1.png', 'image_2.png', ... 'image_n.png'];

function eightBall() {
   var imageToUse = false;
   var answer = document.getElementById('questBox').value;
   answer = answer.toLowerCase();
   // this syntax could be wrong, I forget the check as my JS is rusty
   // check the cache to see if we got asked this before
   if (answerMap[answer] != undefined) {
      // if so, use the cached image value
      imageToUse = answerMap[answer];
   } else {
      // otherwise, get a random image, and add it to the cache
      var randomIndex = Math.floor(Math.random()*images.length);
      imageToUse = images[randomIndex];
      answerMap[answer] = imageToUse;
   }
   // do whatever you need to do with the image
}

Answer 2

在IMG标记中使用该URL，如下所示：

var no = '../images/eightBallNo.png';
$('#answerImages').html('<img src='+no+'/>');

但是，这不使用数组。你需要在哪里使用数组？一组图片网址？

从阵列访问图像？

2 个答案: