数组

Question

我正在尝试使用java脚本帮助显示图片的网站。我此刻设置此网站的方式，图像显示在编号的照片链接上方。我没有在图片下方列出数字，而是希望数字是图片的缩略图。是否可以用图像替换它们？任何帮助表示赞赏。

这是我到目前为止所做的：

var photos = new Array();
var photoindex = 0;

photos[0] = "images/piano.jpg";
photos[1] = "images/guitar.jpg";
photos[2] = "images/studio.jpg";
photos[3] = "images/sheetmusic.jpg";

function backward() {
  if (photoindex > 0) {
    document.images.p.src = photos[--photoindex];
  }
}

function forward() {
  if (photoindex < photos.length - 1) {
    document.images.p.src = photos[++photoindex];
  }
}

for (i = 0; i < photos.length; i++) {
  document.write("<a href=\"javascript: goto(" + i + ");\">" + i + "</a> ");
}

function goto(n) {
  if (n < photos.length && n >= 0) {
    photoindex = n;
    document.images.p.src = photos[photoindex];
  }
}

<br>
<div style="text-align:center;left:5px;">
  <table width="250" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td colspan="3" align="center" valign="top">
        <img src="images/weloveweb.png" name="p" width="250" height="188" id="p" />
      </td>
    </tr>
    <tr>
      <td valign="top"><a href="javascript: backward();">&lt;&lt;</a>
      </td>
      <td valign="top" style="text-align: center">
      </td>
      <td valign="top" style="text-align: right"><a href="javascript: forward();">&gt;&gt;</a>
      </td>
    </tr>
  </table>
</div>

Answer 1

由于您的缩略图网址存储在photos数组中，因此要显示缩略图而不是其索引，您需要创建一个img标记，其中包含src属性每个缩略图的网址（即photos[i]）。

变化：

for (i = 0; i < photos.length; i++) {
  document.write("<a href=\"javascript: goto(" + i + ");\">" + i + "</a> ");
// ------------------------------------------------------------^ change this `i`
}

分为：

for (i = 0; i < photos.length; i++) {
  document.write("<a href=\"javascript: goto(" + i + ");\">" + "<img src=" + photos[i] + "/></a> ");
}