0

我有一些代码用于在单击初始屏幕图像时生成随机图像(在 JavascriptSource 上找到):

<script type="text/javascript">
<!-- Original: Nicholas Lupien-->
<!-- Begin
var rand1 = 0;
var useRand = 0;

images = new Array;
images[1] = new Image();`
images[1].src = "../../Myimages/images/01.png";
images[2] = new Image();
images[2].src = "../../Myimages/images/02.png";
images[3] = new Image();
images[3].src = "../../Myimages/images/03.png";
images[4] = new Image();
images[4].src = "../../Myimages/images/04.png";
images[5] = new Image();
images[5].src = "../../Myimages/images/05.png";
images[6] = new Image();
images[6].src = "../../Myimages/images/06.png";

   function swapPic() {
   var imgnum = images.length - 1;
    do {
      var randnum = Math.random();
      rand1 = Math.round((imgnum - 1) * randnum) + 1;
        } while (rand1 == useRand);
          useRand = rand1;
          document.randimg.src = images[useRand].src;
          }
// End -->
</script>

这部分代码工作正常:用户点击图像,图像变为数组中的另一个随机图像。

但是,我想添加一个描述性文本,以便使用文本生成图像。我不知道如何将文本与正确的图像匹配并让它与图像一起随机生成。我正在使用 Jquery Mobile。

脚步:

1.用户在设备上点击初始随机图像(来自单独数组的文本描述??)。

2. 用户看到带有描述性文字的随机图像。

4

2 回答 2

1

您将需要一个元素来放入描述,并存储描述。出于示例目的,我已经稍微减少了您的代码,但逻辑是相同的:

var rand1 = 0;
var useRand = 0;

var descriptions = [];
images = new Array;
images[1] = new Image();
images[1].src = "../../Myimages/images/01.png";
descriptions[1] = 'This is a description';
images[2] = new Image();
images[2].src = "../../Myimages/images/02.png";
descriptions[2] = 'This is another description';

var descriptionHolder = document.getElementById('description_holder');


function swapPic() {
    var imgnum = images.length - 1;
    do {
        var randnum = Math.random();
        rand1 = Math.round((imgnum - 1) * randnum) + 1;
    }while (rand1 == useRand);
    useRand = rand1;
    document.randimg.src = images[useRand].src;
    descriptionHolder.innerHTML = descriptions[useRand];
}

为此,已将一个新元素添加到具有 id 的页面中description_holder

于 2013-04-14T17:48:27.013 回答
0

您可以简单地使用 alt(或 title)属性:

images[1].alt = "text of image";
于 2013-04-14T17:46:14.740 回答