0

введите сюда описание изображения

У меня проблема. Есть два выпадающих списка. В одном автомобили(марка), в другом модель. Как сделать чтобы при выборе Ауди появлялся выпадающий список только моделей ауди, а при выборе Мерседес соответственно модели под мерседес. И чтобы в первом выпадающем списке если выбрана "марка автомобиля", то второй выпадающий список (с моделями) не появляется до тех пор пока не выберешь ауди или мерседес. Хелп.

Оч желательно чтобы без сторонних библиотек или без них не обойтись? Скрин прилагаю.

3
  • надо повесить обработчик change на первый список, смотреть, что было выбрано и заполнять второй список в зависимости от того, что выбрано - никаких сторонних библиотек для этого не нужно - голый javascript
    – Zhihar
    18 окт 2020 в 19:34
  • спасибо большое, а где можно почитать про этот обработчик change? я новенький в этой теме, слабо разбираюсь. 18 окт 2020 в 19:36
  • w3schools.com/jsref/event_onchange.asp, techiedelight.com/… (смотрите пример голого javascript)
    – Zhihar
    18 окт 2020 в 19:45

1 ответ 1

3

const trademarks = ['Audi', 'ВАЗ'];
const models = [
  ['Q7'],
  ['Kalina', 'Priora']
];
const fill = (id, options) => {
  const sel = document.getElementById(id), def = 0;
  sel.innerHTML = '';
  for (let i = 0; i < options.length; i++) {
    const opt = document.createElement('option');
    opt.value = i;
    opt.innerHTML = options[i];
    if (i === def) {
      opt.selectedIndex = i;
    }
    sel.appendChild(opt);
  }

  return def;
};

fill('model', models[fill('trademark', trademarks)]);
<select id="trademark" onchange="fill('model', models[this.selectedIndex])"></select>
<select id="model"></select>

Ваш ответ

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

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