Javascript数组幻灯片

Question

我对 Javascript 非常陌生，无法让简单的数组幻灯片正常工作。我的计划是让左右按钮更改图像的src。我在网上拍摄了不同幻灯片的不同部分来尝试制作这个。我现在遇到的具体问题是按钮似乎没有做任何事情。我认为他们会在点击时执行我的功能，但我认为我的语法不正确，或者其他东西不正确。任何帮助表示赞赏，但如果解决方案不需要我使用 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 的函数调用中左右传递，但在 HTML 中没有类似的东西，相反，您应该将它们作为字符串传递，如下所示：<input type="button" value="<" onclick="changeImg('left');" /><input type="button" value=">" onclick="changeImg('right');" />并且当您检查脚本中的条件时，请执行以下操作 === 和 '' 更改var index = 0;&nbsp; &nbsp; &nbsp; function changeImg(direction) {&nbsp; &nbsp; &nbsp; &nbsp; document.slide.src = images[index];&nbsp; &nbsp; &nbsp; &nbsp; if (direction === 'left') {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (index == 0) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; index = 35;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; index--;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; if (direction === 'right') {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (index == 35) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; index = 0;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; index++;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; }