更改定時器上的圖像，

我知道這個問題經常被問到，但我不能複製一個代碼。我希望圖像在一段時間後改變。我想我犯了很多錯誤的編碼錯誤。下面是我的代碼。更改定時器上的圖像，

預先感謝幫助，

碧玉

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>test</title> 
     <link rel="stylesheet" type="text/css" href="/css/styles.css"> 
    </head> 
     <body> 

     <img id="image" src="foto1.jpg"> 







      <script type = "text/javascript"> 

       var image=document.getElementById("image"); 
       function volgendefoto() { 

       if (images==0){ 
        image.src="foto2"; 

       } 

        if (images==1){ 
         image.src="foto2"; 

        } 
         if (images==3){ 
          image.src="foto1"; 

         } 
      } 

      function timer(){ 

       setInterval(volgendefoto, 3000); 
          } 

      var images= [], x = -1; 
       image[0]="foto1.jpg"; 
       image[1]="foto2.jpg"; 
       image[2]="foto3.jpg"; 



      </script> 
     </body> 
    </html>

來源

2016-12-02 Jasper Scheper

「無法複製的代碼」？聽起來像一個學校的任務。回到我的日子裏，我們知道如何複製粘貼並更改變量名稱;） – xShirase

是的，它是爲了學校。它太明顯，如果我複製它，他們知道我的編碼行爲和常見錯誤:) –

@xShirase，哈哈ikr –

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>test</title> 
     <link rel="stylesheet" type="text/css" href="/css/styles.css"> 
    </head> 
     <body> 

     <img id="image" src="foto1.jpg"> 





     <script type = "text/javascript"> 

      var image=document.getElementById("image"); 
      var currentPos = 0; 
      var images = ["foto1.jpg","foto2.jpg","foto3.jpg"] 

      function volgendefoto() { 
       if (++currentPos >= images.length) currentPos = 0; 
       image.src = images[currentPos]; 
      } 

      setInterval(volgendefoto, 3000); 

     </script> 





     </body> 
    </html>

來源

2016-12-02 10:18:41 ixpl0

感謝您的快速回答！有用！ –

標記它就像「正確的答案」:) – ixpl0

是的，我做了，我不得不再等3分鐘 –

你沒有創建間隔，從不執行定時器。這裏是一個將循環您的圖片，假設你的第一個圖像的圖像是一個預加載（如：images[0] === image.src在頁面加載）：

const image=document.getElementById("image"); 
    let images= ["foto1.jpg","foto2.jpg","foto3.jpg"], i = 0; 

    function volgendefoto() { 
     i<images.length?i+=1:i=0; 
     image.src=images[i]; 
    } 
    setInterval(volgendefoto, 3000);

來源

2016-12-02 10:17:51 xShirase

感謝您的快速答案！我已經接受了上面的答案，因爲我可以理解這個答案！目前你的代碼對我來說有點複雜。 –

const並讓ES6聲明，你的老師應該強迫你使用它們：p和三元表達式，它只是一個if。 – xShirase

我會問他的！謝謝！ –

更改定時器上的圖像，

回答

相關問題