#javascript
Вопрос:
Я надеюсь, что кто-нибудь сможет сказать мне, что я здесь делаю не так. При попытке зарегистрировать значение artistBox в функции hideProductCard оно возвращает «неопределенное». Однако при регистрации значения artistBox в функции addArtistSelection оно возвращается с правильным значением. Почему это происходит? Обе функции, как видно из условия «если/иначе, если», принимают один и тот же параметр, и он передается обеим функциям, но работает только одна.
// Adding Artist Selection
let artistCheckBoxes = document.querySelectorAll('.artist-filter-input');
let artistProductCards = document.querySelectorAll('.store-card');
artistCheckBoxes.forEach((artistBox) => {
artistBox.addEventListener('click', () => {
if (artistBox.checked === true) {
addArtistSelection(artistBox);
hideProductCard(artistBox);
} else if (artistBox.checked === false) {
document.getElementById(`${artistBox.value}-selection`).remove();
}
});
});
let addArtistSelection = (artistBox) => {
let artistSelectionContainer = document.querySelector('.artist-selection-container');
let artistSelection = document.createElement('p');
artistSelection.classList = 'filter-selection artist-selection';
artistSelection.id = `${artistBox.value}-selection`;
artistSelection.innerHTML = `
${artistBox.value}
`;
artistSelectionContainer.appendChild(artistSelection);
};
let hideProductCard = (artistBox) => {
artistProductCards.forEach((productCard) => {
console.log(productCard.querySelector('.card-title').innerText);
console.log(artistBox.value);
});
};
Комментарии:
1. Предложение: Поместите точку останова отладки внутри своей
addArtistSelection
функции, шаг за шагом переходите от строки к строке и следите за значениемartistBox
. Может быть, ваши манипуляции с DOM (.innerHtml = ...
разрушаютartistBox
элемент?2. @Martin_W Спасибо за ответ. Просто прошел через функцию addArtistSelection строка за строкой с помощью отладчика, и значение осталось правильным. Я также зарегистрировал artistBox.value в конце функции, и она выдала правильное значение. Понятия не имею, что здесь происходит.
3.Хммм… продолжайте использовать отладчик. Какова ценность
artistBox
междуaddArtistSelection(artistBox)
иhideProductCard(artistBox)
. И что происходит с ним внутриhideProductCard(artistBox)
?4. @Martin_W Я заставил его работать. Я все еще довольно новичок в кодировании, поэтому я не уверен, в чем причина этого, но вместо того, чтобы использовать две функции (addArtistSelection и hideProductCard) в операторе if, я переместил hideProductCard в конец функции addArtistSelection. Надеюсь, это нормально. Все еще любопытно, почему это изначально не работало.
5. И, возможно, кто-то еще в SO заметит что-то в коде, что мы пропустили… Но иногда это вопрос «сейчас это работает… двигайся дальше!»