Javascript 错误x[索引]未定义；在幻灯片HTML/CSS/JS中

我在前端开发方面是新手，我想得到一些关于这个错误的帮助

你能帮我解决我面临的问题吗

var指数=1；显示（索引）

函数move（n）{show（index=index+n）；}

函数show（n）{var i；var x= document.getElementsByClassName（“幻灯片”）；for（i=0；i

.w3内容{最大宽度：980px；边距：自动}
.w3中心{文本对齐：中心！重要}
.w3 btn浮动：悬停{框阴影：0 8px 16px 0 rgba（0,0,0,0.2），0 6px 20px 0 rgba（0,0,0,0.19）}
.w3按钮{颜色：#000；背景色：#f1f1f1；填充：8px 16px}。w3按钮：悬停{颜色：#000！重要；背景色：#ccc！重要}
.w3 btn、.w3 btn floating{-webkit touch callout:none；-webkit用户选择：none；-khtml用户选择：none；-moz用户选择：none；-ms用户选择：none；用户选择：none}
.w3 btn浮动{显示：内联块；文本对齐：中心；颜色：#fff；背景颜色：#000；位置：相对；溢出：隐藏；z索引：1；填充：0；边框半径：50%；光标：指针；字体大小：24px}
.w3 btn浮动{宽度：40px；高度：40px；线宽：40px}
.w3 btn浮动：禁用{光标：不允许；不透明度：0.3}.w3禁用*，：禁用*{指针事件：无}
.w3 btn浮动{-webkit转换：背景色.25s，颜色.15s，方框阴影.25s，不透明度0.25s，过滤器0.25s，边框0.15s；转换：背景色.25s，颜色.15s，方框阴影.15s，不透明度.25s，过滤器.25s，边框.15s}

❮
❯
你的JS代码的问题是，你不考虑根据幻灯片的长度来改变索引，这是对左右按钮的点击。

我想说的是，你应该想想当你一直点击右键时会发生什么，所以每次索引都会增加，所以你需要将它设置回第一个图像或幻灯片，在这种情况下，如果（n>x.length）{index=1}

反之亦然

if（n<1）{index=x.length}

用于减少图像或幻灯片（左按钮）的情况

以下是解决此问题所需的JS代码：

var index = 1;
show(index);

function move(n) {
  show(index = index + n);
}

function show(n) {
  var i;
  var x = document.getElementsByClassName("slides");
  if (n > x.length) {index = 1}    
  if (n < 1) {index = x.length} 
  for (i = 0; i < x.length; i++) {
     x[i].style.display = "none";  
  }
  x[index-1].style.display = "block";  
}

❮
❯