o058oo
@o058oo
Кофе, код и рок-н-ролл!

Как скрыть option в select при выборе другого option в select?

Как реализовать на js скрытие option? Суть такая: в id="First" при выборе value="2" Продать, в id="Second" нужно скрыть value="11, 1, 16", а при выборе value="1" Сдать скрыть в id="Second" value="12, 14, 15". Предполагаю, что при выборе value, можно добавлять class="hide" нужным option, но как это реализовать на js не знаю. Подскажите, пожалуйста.
<select id="First">
	<option value="0">Сделайте выбор</option>
	<option value="2">Продать</option>
	<option value="1">Сдать</option>
	<option value="1-1"> - сдать посуточно</option>
	<option value="1-2"> - сдать помесячно</option>
</select>

<select id="Second">
	<option value="0">Тип недвижимости</option>
	<option value="12">Продать квартиру</option>
	<option value="14">Продать дом</option>
	<option value="11">Снять квартру</option>
	<option value="1">Снять дом</option>
	<option value="15">Продать землю</option>
	<option value="16">Арендовать землю</option>
</select>
  • Вопрос задан
  • 600 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
const first = document.querySelector('#first');
const second = document.querySelector('#second');

const showOptions = {
  1: [ '1', '11', '16' ],
  2: [ '12', '14', '15' ],
};

first.addEventListener('change', function() {
  const toShow = showOptions[this.value];
  [...second].forEach(n => n.hidden = +n.value && toShow && !toShow.includes(n.value));
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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