Скрыть <select> если у него один <option>
Добрый день. Помогите пожалуйста, необходима функция js. Задача в следующем, к примеру есть html код:
<select class="form-select"> <option value="All"></option> </select> <select class="form-select"> <option value="All"></option> <option value="25"></option> </select> Необходимо сделать, чтобы если в select заключен только один option, то селекту присваивалось css значение - display:none К сожалению сам в js пока не слишком силен, только осваиваю. |
Зачем же их сервер выводит в браузер, чтобы скрыть на клиенте?
|
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Document</title>
</head>
<body>
<select class="form-select">
<option value="All">All</option>
</select>
<select class="form-select">
<option value="All">All</option>
<option value="25">25</option>
</select>
<script>
var selectElems = document.querySelectorAll(".form-select");
Array.prototype.forEach.call(selectElems, function(item) {
if(item.options.length == 1) item.style.display = "none";
});
</script>
</body>
</html>
|
Свойство length списка уже возвращает число опций в нем.
|
| Часовой пояс GMT +3, время: 21:35. |