Я использую следующий код, чтобы показать/скрыть div на основе выпадающего списка. Тем не менее, я хочу, чтобы каждое большее число сохраняло отображение предыдущих div и просто добавляло еще один div. Пользователь выбирает "количество пассажиров", поэтому выбранная опция должна отображать столько элементов div.
// Copyright 2006-2007 javascript-array.com
var timeout = 500;
var closetimer = 0;
var ddmenuitem = 0;
// open hidden layer
function mopen(id)
{
// cancel close timer
mcancelclosetime();
// close old layer
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
// get new layer and show it
ddmenuitem = document.getElementById(id);
ddmenuitem.style.visibility = 'visible';
}
// close showed layer
function mclose()
{
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
}
// go close timer
function mclosetime()
{
closetimer = window.setTimeout(mclose, timeout);
}
// cancel close timer
function mcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer = null;
}
}
// close layer when click-out
document.onclick = mclose;
См. этот полный скрипт здесь
Ответ 3 · James Williams
<script type="text/javascript">
function display_passengerDiv(){
var numPass = document.getElementById('numPass').value;
var elms = document.getElementsByName('passenger');
for(var h = 0; h<elms.length; h++) {
elms[h].style.display = 'none';
}
for(var i = 0; i < numPass; i++) {
elms[i].style.display = 'block';
}
}
</script>
<select id="numPass" onChange="javascript:display_passengerDiv();">
<option selected="selected">Choose</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<div id="passenger1" name="passenger" style="display:none;"> hey, 1 works </div>
<div id="passenger2" name="passenger" style="display:none;"> hey, 2 works </div>
<div id="passenger3" name="passenger" style="display:none;"> hey, 3 works </div>`enter code here`
Сначала мы получаем значение выбора, а затем используем его для просмотра элементов div. Вязы - это элементы div с именем "пассажир", начинающимся с elms[0] или "пассажир1". Этот код сначала скрывает все div, а затем снова показывает общее количество выбранных элементов.
Ответ 4 · ari
Попробуй это:
<script>
function display_passengerDiv(e){
var i, passenger,
dropdown = document.getElementById('passenger_dropdown'),
numPassengers = dropdown.options.length - 1;
val = dropdown.options[e].text;
if (val.length < 1) {
passenger = 0;
} else {
passenger = parseInt(val);
}
for(i = 1; i <= numPassengers; i++) {
if (i <= passenger) {
document.getElementById('passenger' + i).style.display = "block";
} else {
document.getElementById('passenger' + i).style.display = "none";
}
}
}
</script>
