Помогите изменить код формы
вот код
<!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;'>
<textarea name="text" placeholder="Ваш вопрос"></textarea>
</div>
<script>
var autos = 'BMW X5, Jaguar F5, Lamborgini Italian'.split(', ');
var computers = 'Windows, Mac, Linux'.split(', ');
var connexions = 'Love'.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>
Нужно что бы при выборе из списка 'знакомства' ,'Авто\Мото' появлялось поле ввода текста.
Не судите строго если что не так я новичок в этом деле!
|