0

Что бы было понятнее моя проблема, я напишу сначала 1 вариант кода а потом второй. (Java Script) 1 Код:

var img      = document.querySelectorAll(".slider__li"); //Массив классов с картинками (не активные)
var btn      = document.querySelectorAll(".slider__btn"); //Массив классов с кнопками (не активные)
var page     = document.querySelectorAll(".slider_page_li"); //Массив 2 кнопок
var index    = 0; 
var interval = null;

function moveInterval(){ //Переход картинок и кнопок
    prevClass(img, index, "slider__li"); //Начальная картинка
    prevClass(page, index, "slider_page_li"); //Начальная кнопка
    index++; //Увеличиваем index каждый раз вызывая эту функцию
    if(index >= img.length){
        index = 0;
    }
    nextClass(img, index, "slider__li slider__li_active"); //Меняем картинку под индексом на активную.
    nextClass(page, index, "slider_page_li slider_page_li_active"); //Меняем кнопку под индексом на активную.
}

function prevClass(obj, index, strClass){ //Передаем obj, индекс, и strClass.
    obj[index].className = strClass; 
}
function nextClass(obj, index, strClass){ //Функция для изменение название класса передаваемого элемента под индексом
    obj[index].className = strClass;
}

function startSlide(time){ //Функция по моему для старта 'moveInterval' по заданому времени
    interval = setInterval(moveInterval , time);
}

startSlide(2000); //Вызываем 'startSlide' и каждый 2 секунды вызывается 'moveInterval'

Java Script недавно начал изучать.

Как вы поняли, я вызываю функцию каждый 2 секунды, которая в свою очередь увеличивает index и меняет название класса элемента.

2 Код:

var img      = document.querySelectorAll(".slider__li");
var btn      = document.querySelectorAll(".slider__btn");
var page     = document.querySelectorAll(".slider_page_li");
var index    = 0;
var interval = null;

function target(){ 
    prevClass(img, index, "slider__li"); //Начальные значения элемента img.
    prevClass(page, index, "slider_page_li"); //Начальные значения элемента page.
    if(this.dataset.target === "next"){ //Если элемент имеет data_target="next то:
        index++; //Увеличивает index
        if(index >= img.length){ // проверяет больше или равно максимальному числу картинок
            index = 0; // Если так то обнуляет index
        }
    }else if(this.dataset.target === "prev"){ ////Если элемент имеет data_target="prev" то:
        index--; //Убавляет index
        if(index = 0){ //Если index = 0
            index = img.length - 1; //По моему по этой строки мы делаем начальный index
        }
    }else{ 
        index = parseInt(this.dataset.target);
    }
    nextClass(img, index, "slider__li slider__li_active"); //ТУТ ВОЗНИКАЕТ ОШИБКА
    nextClass(page, index, "slider_page_li slider_page_li_active"); //ТУТ ВОЗНИКАЕТ ОШИБКА
}

function prevClass(obj, index, strClass){
    obj[index].className = strClass; //ТУТ ВОЗНИКАЕТ ОШИБКА: Uncaught TypeError: Cannot set property 'className' of undefined
}
function nextClass(obj, index, strClass){
    obj[index].className = strClass; //ТУТ ВОЗНИКАЕТ ОШИБКА: Uncaught TypeError: Cannot set property 'className' of undefined
}

Array.prototype.map.call(page, function(e){ //Вызов функции target при клики на page
    e.addEventListener("click", target);
});
Array.prototype.map.call(btn, function(e){//Вызов функции target при клики на btn
    e.addEventListener("click", target);
});

В общем то в 2 коде возникает ошибка: Uncaught TypeError: Cannot set property 'className' of undefined (Если что я подметил где именно в комментариях).

И как я понял, что ли не существует... Я вообще не понимаю! Прошу помощи! Если нужно что то дополнить то напишите!

3
  • > //Массив 2 кнопок Почему Вы используете тот же индекс что и для img, если кнопок только две?
    – user176262
    5 апр 2021 в 14:07
  • Добавьте вывод в консоль что такое obj, index. Очевидно, проблема в том что obj[index] не существует, и значит либо у вас нет элементов с подходящим классом и img хранит пустой массив, либо вы устанавливаете неверный индекс. 5 апр 2021 в 14:08
  • Вывел. Скрин вывода: prnt.sc/114xgay Но что то у меня не выводиться index. Именно в блоке if/else
    – Komend
    5 апр 2021 в 14:18

1 ответ 1

1

Извините что так вышло! Все понял. Даже странно то что начал создавать вопрос.

В общем то, я просто в элементе написал не 'data-target' а 'data_target'.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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