Вы можете использовать один из классов, реализующих интерфейс Set ( API ), а затем каждый номер, который вы создаете, используйте Set.add () для его вставки.
Если возвращаемое значение ложно, вы знаете, что номер уже создан раньше.
Возможно, это будет полезно
<select>
<option disabled selected value> -- select an option -- </option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
-- select an option --
Будет отображаться по умолчанию. Но если вы выберете вариант, вы не сможете его выбрать.
Вы также можете скрыть его, добавив пустой option
<option style="display:none">
, чтобы он больше не отображался в списке.
Попробуйте следующее:
<h2>Favorite color</h2>
<select name="color">
<option value=""></option>
<option>Pink</option>
<option>Red</option>
<option>Blue</option>
</select>
Первый вариант в раскрывающемся списке будет пустым.
<td><b>Ação da atividade:</b><br>
<select style='align:left; width:100%;' id='cbxTipoSFA' name='cbxTipoSFA'>
<option hidden selected>Selecione uma opção</option>
<option value='Instalação'>Instalação</option>
<option value='Solicitação'>Solicitação</option>
<option value='Retirada'>Retirada</option></select>
</td>
Просто поместите «скрытый» вариант, который вы хотите скрыть в раскрывающемся списке.
<select required>
<option value="" disabled selected>None</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
В этом случае вы можете избежать выборочной проверки.
Это действительный HTML5 и отправляет пустой (а не пробел) сервер:
<option label=" "></option>
Проверенная достоверность на http://validator.w3.org/check
Проверенное поведение с Win7 (IE11 IE10 IE9 IE8 FF35 Safari5.1) Ubuntu14.10 (Chrome40, FF35) OSX_Yosemite (Safari8, Chrome40 ) Android (Samsung-Galaxy-S5)
Следующее также проходит проверку сегодня , но также пропускает какой-либо символ пробела из большинства браузеров (что, вероятно, не желательно), и blank на других (Chrome40 / Linux пропускает пробел):
<option> </option>
В соответствии с моими заметками, объект без разрыва теги параметров, показанные выше, вызвали следующую ошибку в 2013 году:
Ошибка: W3C Markup Validaton Service (Public): первый дочерний элемент выбора элемента select с обязательным атрибутом и без множественного атрибута , и размер которого равен 1, должен иметь либо пустой атрибут значения, либо не должен содержать текстового содержимого.
В это время регулярное пространство было действительным XHTML4 и отправило пустое (а не пробел) на сервер из каждого браузера:
<option> </option>
Future
Было бы приятно, если бы спецификация была обновлена, чтобы явно разрешить пустую опцию. Предпочтительно использовать самый короткий синтаксис. Любое из следующих было бы замечательно:
<option /> <option></option>
Тестовый файл
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Test</title> </head> <body> <form action="index.html" method="post"> <select name="sel"> <option label=" "></option> </select> </form> </body> </html>
Нет HTML-решения. По спецификации HTML 4.01 поведение браузера не определено, если ни один из элементов option
не имеет атрибута selected
, и что на самом деле браузеры делают так, что они делают первый вариант предварительно выбранным.
As обходной путь, вы можете заменить элемент select
на набор элементов input type=radio
(с тем же name
атрибутом). Это создает контроль одного и того же типа, но с другим внешним видом и пользовательским интерфейсом. Если ни один из элементов input type=radio
не имеет атрибута checked
, ни один из них изначально не выбран в большинстве современных браузеров.
Решение, которое работает только с использованием CSS:
A: Inline CSS
<select>
<option style="display:none;"></option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
B: Стиль CSS Лист
Если у вас есть файл CSS под рукой, вы можете настроить таргетинг на первый option
, используя:
select.first-opt-hidden option:first-of-type {
display:none;
}
<select class="first-opt-hidden">
<option></option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
Я использую структуру Laravel 5 и ответ @Gambi, и работаю для меня, но с некоторыми изменениями для моего проекта.
У меня есть значения параметров в таблице базы данных, и я использую их с заявление foreach. Но перед заявлением я добавил параметр с предложенными настройками @Gambit, и он сработал.
Здесь мой пример:
@isset($keys)
<select>
<option disabled selected value></option>
@foreach($keys as $key)
<option>{{$key->value)</option>
@endforeach
</select>
@endisset
Я надеюсь, что это тоже поможет кому-то. Следите за хорошей работой!
Использовать jQuery:
//With jQuery 1.7.2
$("#myDropdown").attr("selectedIndex", -1);
Пробовал и тестировал для jQuery v1.7.2 (последняя версия от 18 апреля 2012 г.), однако для этой версии «prop» не работает.
Вы можете использовать Javascript для достижения этого. Попробуйте следующий код:
HTML
<select id="myDropdown">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
JS
document.getElementById("myDropdown").selectedIndex = -1;
или JQuery
$("#myDropdown").prop("selectedIndex", -1);
required
в элементе select
и отправляете его без выбора опции, проверка формы завершится неудачно и сообщит вам, вы должны сделать выбор. Поэтому мне очень нравится этот подход. (По крайней мере, проверено в Chrome)
– Andreas Linnert
11 February 2017 в 11:28
Попробуйте это:
<select>
<option value="">
<option>Option 1
<option>Option 2
<option>Option 3
</select>
Проверяет в HTML5. Работает с атрибутом required
в элементе select. Можно повторно выбрать . Работает в Google Chrome 45, Internet Explorer 11, Edge, Firefox 41.
<option hidden disabled selected value> -- select an option -- </option>
– BrainOverflow 26 March 2017 в 11:43