Javascript 陣列幻燈片

Question

我對 Javascript 非常陌生，並且無法讓簡單的數組幻燈片工作。 我的計划是讓左右按鈕更改圖像的src 。 我在網上拍攝了不同幻燈片的不同部分來嘗試制作這個。 我現在遇到的具體問題是按鈕似乎沒有做任何事情。 我認為他們會在點擊時執行我的 function ，但我認為我的語法不正確，或者其他東西不正確。 任何幫助表示贊賞，但如果解決方案不需要我使用 jQuery 或 PHP，我更喜歡它，因為我對 JS 還是很陌生。 謝謝。

 var images = [ "Gallery/1.jpg", "Gallery/2.jpg", "Gallery/3.png", "Gallery/4.jpg", "Gallery/5.jpg", "Gallery/5-1.jpg", "Gallery/6.jpg", "Gallery/7.jpg", "Gallery/8.jpg", "Gallery/9.jpg", "Gallery/10.jpg", "Gallery/11.jpg", "Gallery/12.jpg", "Gallery/13.jpg", "Gallery/14.jpg", "Gallery/15.jpg", "Gallery/16.jpg", "Gallery/17.jpg", "Gallery/18.jpg", "Gallery/19.jpg", "Gallery/20.jpg", "Gallery/21.jpg", "Gallery/22.jpg", "Gallery/23.jpg", "Gallery/24.jpg", "Gallery/25.jpg", "Gallery/26.jpg", "Gallery/27.jpg", "Gallery/28.jpg", "Gallery/29.jpg", "Gallery/30.jpg", "Gallery/31.jpg", "Gallery/32.jpg", "Gallery/33.jpg", "Gallery/34.jpg", "Gallery/35.jpg", "Gallery/36.jpg", ]; var index = 0; function changeImg(direction) { document.slide.src = images[index]; if (direction == left) { if (index == 0) { index = 35; } else { index--; } } if (direction == right) { if (index == 35) { index = 0; } else { index++; } } }

 <div id="slideshow"> <img name="slide" src="Gallery/1.jpg"> </div> <input type="button" value="<" onclick="changeImg(left);" /> <input type="button" value=">" onclick="changeImg(right);" />

Answer 1

我可以看到您在來自 HTML 的 function 調用中左右傳遞，但是在 HTML 中沒有類似的東西，而是應該將它們作為字符串傳遞，如下所示：

<input type="button" value="<" onclick="changeImg('left');" />
<input type="button" value=">" onclick="changeImg('right');" />

並且當您檢查腳本中的條件時，請執行以下操作 === 和 '' 更改

var index = 0;

      function changeImg(direction) {
        document.slide.src = images[index];

        if (direction === 'left') {
          if (index == 0) {
            index = 35;
          } else {
            index--;
          }
        }

        if (direction === 'right') {
          if (index == 35) {
            index = 0;
          } else {
            index++;
          }
        }
      }