0

Мне нужно получать значение массива по индексу. Суть в том, что по клику на кнопку prev, мне нудно получить следующее значение в массиве, а по клику на кнопку next, предыдущее. По сути нужна карусель, которая после последнего элемента будет переходить на первый

Мне кажется я что то усложняю.

var arrColors = ['red', 'blue', 'green'];
var currentColor = 0;
var currentColorValue = "";

$('.arrow-prev').on('click', function () {
    if(currentColor === 0){
        currentColorValue = arrColors[0];
    } else if (currentColor === 1){
        currentColorValue = arrColors[1];
    } else if (currentColor === 2){
        currentColorValue = arrColors[2];
    } else {
        currentColor = -1;
    }
    currentColor++;
});
$('.arrow-next').on('click', function () {

});

2 ответа 2

1

Чисто формальность - обычно next это следующая, а prev это предыдущая, но хозяин барин в моем варианте будет работать не зависимо от длинны массива и в ту и в другую сторону.

$('.arrow-prev').on('click', function () {
  if(currentColor < arrColors.length-1){
    currentColor ++;
  } else  {
    currentColor = 0;
  }
  currentColorValue = arrColors[currentColor];
});
$('.arrow-next').on('click', function () {
  if(currentColor === 0){
    currentColor = arrColors.length-1;
  } else {
     currentColor--;
  }
  currentColorValue = arrColors[currentColor];
});
0

Если я правильно понял вашу задачу, то достаточно просто проверять крайние позиции указателя, перед входом в функцию и перемещать его в начала или конец, в зависимости от нажатой клавиши, код ниже.

$('.arrow-prev').on('click', function () {
    if(currentColor === 0){
        currentColor = 2;
    } else {
       currentColor--;
    }
    currentColorValue = arrColors[currentColor];
});
$('.arrow-next').on('click', function () {
    if(currentColor === 2){
        currentColor = 0;
    } else {
       currentColor++;
    }
    currentColorValue = arrColors[currentColor];
});

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.