Зависимые списки — распространённый паттерн в веб-формах для работы с иерархическими данными. Идея проста: при выборе значения в первом выпадающем списке, во втором автоматически убираются или добавляются соответствующие опции.
HTML структура
Два элемента select: первый содержит марки автомобилей (Volvo, Saab, Mercedes, Audi), второй — модели (740, 940, 240, 340).
jQuery реализация
Скрипт слушает изменения в первом селекторе и при выборе «volvo» удаляет первые две опции из второго списка. Селектор :lt(2) выбирает элементы с индексом меньше 2.
$('#myselect1').change(function(){
if($(this).val() == 'volvo'){
$('#myselectVolvo option:lt(2)').remove();
}
});
Это базовый пример, демонстрирующий принцип работы зависимых списков. В реальных проектах логику можно расширить: подгружать опции через AJAX, добавлять несколько уровней зависимости, восстанавливать опции при смене значения.