Как переключить изображение с помощью JQuery при нажатии на кнопку

Question

Сценарий у меня до сих пор:

var array = ["heil.jpeg","8bit_12.jpeg","city.jpg"]; 

$("#next").click(function() { 
    $("img").fadeOut(function() { 
     for(var i=0; i < array.length; i++) { 
      $(this).attr('src', array[i]).fadeIn(); 
     } 
    }); // end fadeOut 
}); 

Как я могу сделать индекс выбора следующего элемента в массиве при нажатии на кнопку #next?

JSFiddle: http://jsfiddle.net/qo5u81dk

Answer 1

Вы переключили идентификаторы «назад» и «следующий», . Кроме того, необходимо рассчитать индекс для изображения массива (drawNum) правильно и использовать его.

$("#next").click(function() { 
    var drawNum = Math.round(Math.random() * (array.length)); 
    $("img").fadeOut(function() { 
    for (var i = 1; i < array.length; i++) { 
     $(this).attr('src', array[drawNum]).fadeIn(); 
    } 
    }); 
}); 

Я изменил ваш jsfiddle немного и он должен работать.

https://jsfiddle.net/qo5u81dk/2/

Answer 2

ид-s в вашем li> DIV инвертируются - кнопка с надписью "NEXT" имеет идентификатор = "назад" и наоборот. В коде, который вы разместили $ («# next»). Click (function(), если вы замените «#next» на «#back», он работает.