首页 > 解决方案 > 有人可以帮我解决这个与图片幻灯片有关的问题吗?

问题描述

我不知道问题是否在于我将脚本放在 html 文件中,无论如何幻灯片无法正常工作,我想问是否有人可以帮我解决这个问题,代码如下。不知何故,幻灯片无法正常工作,但图片显示在实时服务器中

<!DOCTYPE html>
<html>
  <body style="color:black">
    <a href='https://postimg.cc/ZWcwYbzT' target='_blank'><img id="image" src='https://i.postimg.cc/ZWcwYbzT/172374980-914208975812746-8979130836703230386-n.jpg' border='0' width="100" alt='172374980-914208975812746-8979130836703230386-n'/></a>
    <a href='https://postimg.cc/QV9dZVZr' target='_blank'><img id="image1" src='https://i.postimg.cc/QV9dZVZr/172124635-284285833185228-6477325913542767940-n.jpg' border='0' width="100" alt='172124635-284285833185228-6477325913542767940-n'/></a>

    <br>
    <input type="button" value="Start Slide Show" onClick="startSlideShow()">
    <input type="button" value="Stop Slide Show" onClick="stopSlideShow()">
    <script>

   <input type="button" value="Start Slide Show" onClick="startSlideShow()">
    <input type="button" value="Stop Slide Show" onClick="stopSlideShow()">
    <script>
      var intervalID;
  
      function startSlideShow(){
          intervalID = setInterval(changeImage, 800); 
      }
  
      function stopSlideShow(){
          clearInterval(intervalID);  
      }
  
      function changeImage(){
          var imageSrc = document.getElementById("image").getAttribute("src");
          var currentImageNumber = imageSrc.substring(imageSrc.lastIndexOf("/") + 1, imageSrc.lastIndexOf("/") + 2);
          if(currentImageNumber == 7){
              currentImageNumber = 0;
          }
  
          document.getElementById("result").innerHTML = currentImageNumber;
          document.getElementById("image").setAttribute("src",  "images/" + (Number(currentImageNumber)+1) + ".jpg");     
  
      }
      changeImage();
  </script>
  </body>
</html>

标签: javascriptslideshow

解决方案


问题在于这部分:

   <input type="button" value="Start Slide Show" onClick="startSlideShow()">
    <input type="button" value="Stop Slide Show" onClick="stopSlideShow()">
    <script>

在您的代码中连续出现两次。所以你的脚本中有 HTML 标签,这会产生语法错误。删除第二次出现,你会没事的。


推荐阅读