在导航过程中保持数组的位置

Question

我有一个图像数组，用于在点击时替换DIV背景。 我有两个按钮(基本上是前进和反向)，我试图完成的是，让前进(或后退)按钮在执行函数之前保持数组的最后一个位置，这是代码;

var ImagesB = []; 
ImagesB[0]="images/image1.png";
ImagesB[1]="images/image2.png";
ImagesB[2]="images/image3.png";
var i = 1;
function updateImgB(){
var url = 'url(' + ImagesB[i] + ')';
document.getElementById('DIV1').style.backgroundImage = url;
i = (i + 1)%(ImagesB.length);
}
function reverseImgB(){
var url = 'url(' + ImagesB[i] + ')';
document.getElementById('DIV1).style.backgroundImage = url;
i = (i - 1)%(ImagesB.length);
if(i < 0){i = ImagesB.length - 1};
}

目前这是有效的，但是例如您执行updateImgB，它以数组中的下一个数字结尾，例如：i + 1，因此如果我执行reverseImgB函数，它会从下一个图像开始，即：2，然后将向后工作。 我打算让它从当前图像向后工作，反之亦然。

任何帮助表示赞赏。

Answer 1

只需在更改图像之前从i中减去1：

function reverseImgB(){
i = (i - 1)%(ImagesB.length);
if(i < 0){i = ImagesB.length - 1};
var url = 'url(' + ImagesB[i] + ')';
document.getElementById('DIV1).style.backgroundImage = url;
}