Как сделать фильтрацию одинаковых элементов в списке SELECT -> OPTION?
У меня есть два списка (select) с элементами option, каждый из которых имеет value от 1 до 100. Я хочу сделать временное исчезновение из другого списка того option, который был выбран в одной из форм. Чтобы не показывать повторения. Также, если элемент поменялся, то его нужно снова показать.
Подскажите, как это лучше сделать? Пытался делать проверки и скрывать их с помощью hide() (jQuery), но таким образом у меня скрываются один элемент за другим, что совсем не нужно :-) Гуглил, но ничего подобного не нашел, хотя обычно Stackoverflow в помощь. |
зависимые селекты запрет одинакого выбора
Enkille,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<select size="15">
<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>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
</select>
<select size="15">
<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>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
</select>
<script>
window.addEventListener("DOMContentLoaded", function() {
var a = document.querySelectorAll("select");
[].forEach.call(a, function(c, b) {
b = a[+!b];
var d = b.querySelectorAll("option");
c.addEventListener("change", function() {
b.options.length = 0;
[].forEach.call(d, function(a) {
a.value !== c.value && b.appendChild(a)
})
})
})
});
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 08:16. |