Изображение меняется автоматически - кнопка Пуск

Question

Я хотел добавить кнопку, чтобы начать изменение между изображениями, чтобы избежать начала изменения самостоятельно

Вы должны нажимать кнопку, пока изменение не начнется

      var imageSources = ["https://www.w3schools.com/css/img_fjords.jpg", "https://www.w3schools.com/howto/img_mountains.jpg"]

      var index = 0;
      setInterval(function(){
        if (index === imageSources.length) {
          index = 0;
        }
        document.getElementById("image").src = imageSources[index];
        index++;
      }, 2000);

 <img id="image" src="https://www.w3schools.com/css/img_fjords.jpg" style="width:300px">

Answer 1

Привет, пожалуйста, взгляни, надеюсь, это полезно. Спасибо https://jsfiddle.net/sanat/xc5w8ngy/7/

<button id="start">
start
</button>
<button id="stop">
stop
</button>
<br>
<br>

<img id="image" src="https://www.w3schools.com/css/img_fjords.jpg" style="width:300px">



var myVar = '';
    $(function(){
        $("#start").on('click',function(){
       var imageSources = ["https://www.w3schools.com/css/img_fjords.jpg", "https://www.w3schools.com/howto/img_mountains.jpg"]


      var index = 0;
     myVar = setInterval(function(){
        if (index === imageSources.length) {
          index = 0;
        }
        document.getElementById("image").src = imageSources[index];
        index++;
      }, 2000);

      });

      $("#stop").on('click',function(){
         clearInterval(myVar);
      });

    });