Wie kann ich aufhören, Foto in html zu ändern

Ich möchte helfen, diese Codeausführung nach nur drei Mal zu stoppen?Wie kann ich aufhören, Foto in html zu ändern

Ich habe drei Fotos und wollen dreimal ändern und

<!DOCTYPE html> 

<html> 
    <head> 
     <title>change picture</title> 
     <script type = "text/javascript"> 
      function displayNextImage() { 
       x = (x === images.length - 1) ? 0 : x + 1; 
       document.getElementById("img").src = images[x]; 
      } 

      function displayPreviousImage() { 
       x = (x <= 0) ? images.length - 1 : x - 1; 
       document.getElementById("img").src = images[x]; 
      } 

      function startTimer() { 
       setInterval(displayNextImage, 3000); 
      } 

      var images = [], x = -1; 
      images[0] = "image1.jpg"; 
      images[1] = "image2.jpg"; 
      images[2] = "image3.jpg"; 
     </script> 
    </head> 

    <body onload = "startTimer()"> 
     <img id="img" src="1.jpg"/> 
     <button type="button" onclick="displayPreviousImage()">Previous</button> 
     <button type="button" onclick="displayNextImage()">Next</button> 
    </body> 
</html>

können Sie mir helfen stoppen?

Quelle

2016-03-20 Mona Ahmad

Versuchen Sie, (alle) relevante Tags hinzuzufügen, wenn Sie eine Frage stellen. Auf diese Weise werden viel mehr Menschen in der Lage sein, Sie zu erreichen und somit zu versuchen und Ihnen zu helfen. HTML ist nicht wirklich, was diese Frage ist, es sollte Javascript sein. Viel Glück! – SND

Sie müssen 'clearInterval' Methode verwenden, siehe [w3schools.com Window clearInterval() Methode] (http://www.w3schools.com/jsref/met_win_clearinterval.asp) – Spidey

Verwenden Sie clearInterval, um die setInteval-Funktion zu stoppen.

<!DOCTYPE html> 
 

 
<html> 
 
    <head> 
 
    <title>change picture</title> 
 
    <script type = "text/javascript"> 
 
     var interval = 0; 
 
     var counter = 0; 
 
     
 
     function displayNextImage() { 
 
     x = (x === images.length - 1) ? 0 : x + 1; 
 
     document.getElementById("img").src = images[x]; 
 
     counter++; 
 
     console.log(counter); 
 
     if (counter == 3) { 
 
      clearInterval(interval); 
 
     } 
 
     } 
 

 
     function displayPreviousImage() { 
 
     x = (x <= 0) ? images.length - 1 : x - 1; 
 
     document.getElementById("img").src = images[x]; 
 
     } 
 

 
     function startTimer() { 
 
     interval = setInterval(displayNextImage, 3000); 
 
     } 
 

 
     var images = [], x = -1; 
 
     images[0] = "http://i.stack.imgur.com/0qVbB.jpg"; 
 
     images[1] = "http://i.stack.imgur.com/Z4D6Z.jpg"; 
 
     images[2] = "http://i.stack.imgur.com/JbyGx.jpg"; 
 
    </script> 
 
    </head> 
 

 
    <body onload = "startTimer()"> 
 
    <img id="img" src="http://i.stack.imgur.com/0qVbB.jpg"/> 
 
    <button type="button" onclick="displayPreviousImage()">Previous</button> 
 
    <button type="button" onclick="displayNextImage()">Next</button> 
 
    </body> 
 
</html>

Quelle

2016-03-20 08:37:53

Ist diese Antwort Ihre Frage? –

ja. Danke für die Hilfe –

Ich bin glücklich zu hören :) Bitte [akzeptieren] (http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work#5235) die Antwort so wird anderen Menschen helfen. –

dieses Problem gelöst bereits here (akzeptierte Antwort, zweiter Codeblock)!

Quelle

2016-03-20 09:04:04

Wie kann ich aufhören, Foto in html zu ändern

Antwort

Verwandte Themen