Показать сообщение отдельно
  #9 (permalink)  
Старый 06.09.2013, 00:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,127

Зависимые селекты
Сообщение от BETEPAH
Это уже неинтересно.
согласен
Georka,

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
#second {
display:   none;
}
</style>
</head>
<body>
<select id="first">
 <option value="0" selected >Не выбрано</option>
 <option value="1">Авто\Мото</option>
 <option value="2">Компьютеры</option>
 <option value="3">Знакомство</option>
</select>
<select id="second">
<option value="0" selected >Не выбрано</option>
</select>

<div id='autos1' style='display: none;'>BMW X5</div>
<div id='autos2' style='display: none;'>Jaguar F5</div>
<div id='autos3' style='display: none;'>Lamborgini Italian</div>
<div id='computers1' style='display: none;'>Windows</div>
<div id='computers2' style='display: none;'>Mac</div>
<div id='computers3' style='display: none;'>Linux</div>
<div id='connexions1' style='display: none;'>Love</div>
<div id='connexions2' style='display: none;'>Meeting</div>
<div id='connexions3' style='display: none;'>Sex</div>
<script>
(function ()
{
var autos = 'BMW X5, Jaguar F5, Lamborgini Italian'.split(', ');
var computers = 'Windows, Mac, Linux'.split(', ');
var connexions = 'Love, Meeting, Sex'.split(', ');
var two = [autos,computers,connexions];
var group = 'autos,computers,connexions'.split(',');
var j;
var old;
document.getElementById('first').onchange = function(){
    var select =  document.getElementById('second');
    j = this.value;
    select.style.display = "none";
    old && (old.style.display = "none");
    select.options.length = 1;
    if (j) {
         var options = two[--j];
    for (var i = 1; i <= options.length; i++) {
           select.options[i] = new Option(options[i-1], i); ;
        }
    select.style.display = "inline-block";
    }
}

document.getElementById('second').onchange = function(){
  old && (old.style.display = "none");
  old = document.getElementById(group[j]+this.value);
  old && (old.style.display = "block");
}
})()
</script>
</body>
</html>

Последний раз редактировалось рони, 06.09.2013 в 00:22.
Ответить с цитированием