JavaScript говорит, что кнопка не найдена, хотя она есть. Я полагаю, что javascript искал кнопку, которая указана при создании в первом объекте, т.е. здесь:
var changeInputs = new InfoChange('.button--profile-change', '.textinput-container__input--change', 'textinput-container__input--change-unactive', 'save');
А ее действительно не существует, но я не могу убрать эту строчку, т.к. скрипт работает на нескольких страницах. Пробовал сделать проверку:
this.ready = this.btnEvent && this.inputsToChange;
if(!this.ready) {
return;
};
Это не дало нужных результатов, подскажите пожалуйста, как исправить?
function InfoChange(btnEvent, inputsToChange, classToBlock, buttonTextChange) {
this.btnEvent = document.querySelector(btnEvent);
this.inputsToChange = document.querySelectorAll(inputsToChange);
this.classToBlock = classToBlock;
this.buttonTextChange = buttonTextChange;
this.currentBtnText = this.btnEvent.textContent;
var _this = this;
this.ready = this.btnEvent && this.inputsToChange;
if(!this.ready) {
return;
};
var buttonAttr = function() {
_this.btnEvent.setAttribute('data-status', 'unactive');
};
buttonAttr();
this.btnEvent.addEventListener('click', function() {
var btnAttribute = _this.btnEvent.getAttribute('data-status');
if (btnAttribute == 'unactive') {
_this.btnEvent.setAttribute('data-status', 'active');
_this.btnEvent.textContent = _this.buttonTextChange;
} else {
_this.btnEvent.setAttribute('data-status', 'unactive');
_this.btnEvent.textContent = _this.currentBtnText;
};
for(var i = 0; i < _this.inputsToChange.length; i++) {
_this.inputsToChange[i].addEventListener('change', function(event) {
var currentItem = event.target;
var currentValue = event.target.value;
currentItem.setAttribute('value', currentValue);
});
if(_this.inputsToChange[i].classList.contains(classToBlock)) {
_this.inputsToChange[i].classList.remove(classToBlock);
_this.inputsToChange[i].removeAttribute('disabled');
} else {
_this.inputsToChange[i].classList.add(classToBlock);
_this.inputsToChange[i].setAttribute('disabled', '');
};
};
});
};
var changeInputs = new InfoChange('.button--profile-change', '.textinput-container__input--change', 'textinput-container__input--change-unactive', 'save');
var changePass = new InfoChange('.button--profile--change-pass', '.textinput-container__input--change-pass', 'textinput-container__input--change-unactive', 'save');
var changePass = new InfoChange('.button--profile--from-to', '.textinput-container__input--from-to', 'textinput-container__input--change-unactive', 'update');
var changeCV = new InfoChange('button', 'input', 'un', 'save');
.un {
border: none;
background-color: red;
}
<input type="text">
<button>Button</button>
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
В СПА есть экран с таблицейТаблица с пагинацией, фильтрацией, сортировками
У меня есть хранилище данных в vuex и два компонентПервый компонент это range slider, в котором я меняю значения слайдера и сразу же отправляю их в store