Как я могу установить значение по умолчанию для HTML < select > элемент?

Установите selected = "selected" для опции, которую вы хотите использовать по умолчанию.

3

Если вы хотите, чтобы текст по умолчанию был своего рода заполнителем / подсказкой, но не считался допустимым значением (что-то вроде «завершено здесь», «выберите свою нацию» и т. Д.) Вы можете сделать что-то вроде этого:

& Лт;!- начать фрагмент: js hide: ложная консоль: истинная павиана: false - >

<select>
  Choose here
  One
  Two
  Three
  Four
  Five

Полный пример:

& Лт;!- начать фрагмент: js hide: ложная консоль: истинная павиана: false - >

<select name="hall" id="hall"> 

    1 


    2 


    3 


    4 


    5 

Я столкнулся с этим вопросом, но принятый и высоко оцененный ответ не сработал для меня. Оказывается, если вы используете React, то установка selected не работает.

Вместо этого вы должны установить значение в теге < select >, как показано ниже:

<select value="B">
  Apple
  Banana
  Cranberry

Вы можете сделать это так:

<select name="hall" id="hall">
     1 
     2 
     3 
     4 
     5 

если вы хотите использовать значения из формы и поддерживать ее динамически, попробуйте это с php

<?php
    $selected = $_POST['select'];
?>

<select name="select" size="1">

  >1
  >2

Я предпочитаю это:

<select>
   Choose here
   One
   Two
   Three
   Four
   Five

Улучшение ответа [nobita][1]. Также вы можете улучшить визуальный просмотр выпадающего списка, скрыв элемент «Выберите здесь».

& Лт;!- начать фрагмент: js hide: ложная консоль: истинная павиана: false - >

<select>
  Choose here
  One
  Two
  Three
  Four
  Five


  [1]: https://stackoverflow.com/users/1446845/nobita

Другой пример; используя JavaScript, чтобы установить выбранную опцию.

• (Вы можете использовать этот пример для объединения массива значений в раскрывающийся компонент) *

< select id = "yourDropDownElementId" > < select / >

// Get the select element
var select = document.getElementById("yourDropDownElementId");
// Create a new option element
var el = document.createElement("option");
// Add our value to the option
el.textContent = "Example Value";
el.value = "Example Value";
// Set the option to selected
el.selected = true;
// Add the new option element to the select element
select.appendChild(el);

Атрибут selected является логическим атрибутом.

При наличии указывается, что опция должна быть предварительно выбрана при загрузке страницы.

Предварительно выбранный параметр будет отображаться первым в раскрывающемся списке.

<select>
  Volvo
 Saab
 VW
 Audi 

Лучший способ на мой взгляд:

& Лт; select >
   < option value = "" selected = "selected" hidden = "hidden" > Выберите здесь < / option >
   < значение опции = "1" > One < / option >
   < значение опции = "2" > два < / опция >
   < значение опции = "3" > три < / опция >
   < значение опции = "4" > четыре < / опция >
   < значение опции = "5" > Five < / option >
& Лт; / select >

Почему не отключен?

Когда вы используете отключенный атрибут вместе с < button type = "reset" > Reset < / button > значение не сбрасывается на исходный заполнитель. Вместо этого браузер выбирает первый не отключенный параметр, который может вызвать ошибки пользователя.

По умолчанию пустое значение

Каждая производственная форма имеет валидацию, тогда пустое значение не должно быть проблемой. Таким образом, мы можем иметь пустой не требуется выбирать.

Атрибуты синтаксиса XHTML

Синтаксис selected = "selected" - единственный способ быть совместимым как с XHTML, так и с HTML 5. Это правильный синтаксис XML, и некоторые редакторы могут быть рады этому. Это более обратно совместимо. У меня нет сильных чувств по этому поводу, но если аргументы выше упоминания являются вашими требованиями, вы должны следовать полному синтаксису.

Если вы находитесь в режиме реакции, вы можете использовать defaultValue в качестве атрибута вместо value в теге select.

Если вы используете select с угловым значением 1, то вам нужно использовать ng-init, в противном случае второй параметр не будет выбран, поскольку ng-модель переопределяет выбранное значение defaul

<select ng-model="sortVar" ng-init='sortVar="stargazers_count"'>
  Name
  Stars
  Language

Этот код устанавливает значение по умолчанию для элемента выбора HTML с PHP

<select name="hall" id="hall">
<?php
    $default = 3;
    $nr = 1;
    while($nr < 10){
        if($nr == $default){
            echo "". $nr ."";
        }
        else{
            echo "". $nr ."";
        }
        $nr++;
    }
?>

Я использовал эту функцию php для генерации параметров и вставки их в свой HTML

<?php
  # code to output a set of options for a numeric drop down list
  # parameters: (start, end, step, format, default)
  function numericoptions($start, $end, $step, $formatstring, $default)
  {
    $retstring = "";
    for($i = $start; $i 

А потом в своем коде веб-страницы я использую его, как показано ниже ;

<select id="endmin" name="endmin">
  <?php echo numericoptions(0,55,5,'%02d',$endmin); ?>

атрибут value < option > тег отсутствует, поэтому он не отображается в соответствии с выбранным пользователем. По умолчанию первый параметр отображается при загрузке раскрывающейся страницы, если атрибут value установлен на < option > тег.... Я решил свою проблему таким образом

Я просто сделаю значение первого параметра выбора по умолчанию и просто скрываю это значение в раскрывающемся списке с новой функцией HTML5 «скрытый». Нравится:

   <select name="" id="">
     Select An Option
     One
     Two
     Three
     Four

Вы можете использовать:

Some Value

вместо

Some Value

оба одинаково правы.

Я сам использую это

<select selected=''>

    ccc
    xxx
    zzz
    aaa
    qqq
    wwww

Вам просто нужно поместить атрибут «выбранный» в определенный параметр, а не направлять его на элемент выбора.

Вот фрагмент для одного и нескольких рабочих примеров с разными значениями.

& Лт;!- начать фрагмент: js hide: ложная консоль: истинная павиана: false - >

   Select Option 3 :- 
   <select name="hall" id="hall">
    1
    2
    3
    4
    5

    1
    2
    3
    4
    5

    1
    2
    3
    4
    5