Ограничение значений в Select
Здравствуйте.
Имеются 2 Select(a). В первом последовательно числа от 1 до 12, во вторм от 0 до 11 Задача: Ограничить выбор во втором Select до значения которое в сумме числа с первым даст максимальное значение 12. Подскажите если знаете. |
SeGun,
Выложите HTML, (*и второе - есть input type=number ему и заранее ограничение удобней задать и нагляднее |
SeGun,
:cray:
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8" />
</head>
<body>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
</select>
<script>
var select = document.getElementsByTagName('select')[0];
select.addEventListener('change', function() {
var i = this.selectedIndex
var select = document.getElementsByTagName('select')[1];
select.options.length=0
for (var k=0; k<12-i; k++) {
select.options[k] = new Option(k, k);
}
});
</script>
</body>
</html>
|
И правда профессура!
Спасибо огромное!
:dance: |
Прикола ради слегка модифицировал скрипт. Во-первых, можно избавиться от множественных new Option после каждого изменения, во-вторых, в моем варианте сохраняются первоначальный текст, (если от отличается от просто циферок)
<script type="text/javascript">
(function() {
var select2 = document.getElementsByTagName('select')[1];
var optionStore = [];
for( var i = 0; i < select2.options.length; ++i )
optionStore[i] = select2.options[i];
var select1 = document.getElementsByTagName('select')[0];
select1.addEventListener('change', function() {
var i = this.selectedIndex
select2.options.length=0
for (var k=0; k<12-i; k++)
select2.options[k] = optionStore[k];
});
} )();
</script>
|
Или даже так:
<script type="text/javascript">
(function() {
var select2 = document.getElementsByTagName('select')[1];
var optionStore = [];
for( var i = 0; i < select2.options.length; ++i )
optionStore[i] = select2.options[i];
var select1 = document.getElementsByTagName('select')[0];
select1.addEventListener('change', function() {
var i = this.selectedIndex
if( select2.options.length >= 12-i )
select2.options.length = 12-i;
else
for (var k=select2.options.length; k<12-i; k++)
select2.options[k] = optionStore[k];
});
} )();
</script>
|
| Часовой пояс GMT +3, время: 07:09. |