Panthablack
@Panthablack

Почему не работает скрипт для Selectа?

const dropdowns = document.querySelectorAll('.dropdown');

dropdowns.forEach(dropdown =>{
	const select = dropdown.querySelector('.select');
	const caret = dropdown.querySelector('.caret');
	const menu = dropdown.querySelector('.menu');
	const options = dropdown.querySelectorAll('.menu li');
	const selected = dropdown.querySelector('.selected');

	select.addEventListener('click', () => {
		select.classList.toggle('select-clicked');

		caret.classList.toggle('caret-rotate');

		menu.classList.toggle('menu-open');

	});

	options.forEach(option => {
		option.addEventListener('click', () => {

			selected.innerText = option.innerText;

			select.classList.remove('select-clicked');

			caret.classList.remove('caret-rotate');

			menu.classList.remove('menu-open');

			options.forEach(option => {
				option.classList,remove('active');
			});

		option.classList.add('active');
		});
	});
});


Код javascript. При выполнении должно работать выпадающее меню. Должны срабатывать css стили при нажатии на кнопку. Не могу найти ошибку. Js правильно подключен. Проверял alertом

<div class="dropdown">
				<div class="select">
					<span class="selected">
						More Filters
					</span>
					<div class="caret"></div>
				</div>
				<ul class="menu">
					<li class="active"> More Filters</li>
					<li>Recently listed</li>
					<li>Recently sold</li>
					<li>Price Low to High</li>
					<li>Price High to Low</li>
				</ul>
			</div>
  • Вопрос задан
  • 56 просмотров
Пригласить эксперта
Ответы на вопрос 1
ThunderCat
@ThunderCat Куратор тега CSS
{PHP, MySql, HTML, JS, CSS} developer
замените ваш модный const внутри цикла на var или let, так как по коду вы его активно меняете, что для константы недопустимо.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы