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

Question

Я думал, что добавление атрибута "value", установленного для элемента <select> ниже, приведет к тому, что <option>, содержащий мои предоставленные "value", будут выбраны по умолчанию:

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

Однако это не сработало, как я ожидал. Как установить, какой элемент <option> выбран по умолчанию?

Answer 1

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

Answer 2

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

<select ng-model="sortVar" ng-init='sortVar="stargazers_count"'>
  <option value="name">Name</option>
  <option selected="selected" value="stargazers_count">Stars</option>
  <option value="language">Language</option>
</select>

Answer 3

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

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

Answer 4

Я использовал эту функцию 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 <= $end; $i = $i + $step)
    {
      $retstring = $retstring . '<OPTION ';
      $retstring = $retstring . 'value="' . sprintf($formatstring,$i) . '"';
      if($default == $i)
      {
        $retstring = $retstring . ' selected="selected"';
      }
      $retstring = $retstring . '>' . sprintf($formatstring,$i) . '</OPTION> ';
    }

  return $retstring;
  }

?>

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

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

Если$ endmin создается из переменной _POST каждый раз, когда страница загружается (и этот код находится внутри формы, которая публикует сообщения), тогда по умолчанию выбирается ранее выбранное значение.

Answer 5

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

Answer 6

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

   <select name="" id="">
     <option hidden value="default">Select An Option</option>
     <option value="1">One</option>
     <option value="2">Two</option>
     <option value="3">Three</option>
     <option value="4">Four</option>
   </select>

Answer 7

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

<select>
   <option value="" selected="selected" hidden="hidden">Choose here</option>
   <option value="1">One</option>
   <option value="2">Two</option>
   <option value="3">Three</option>
   <option value="4">Four</option>
   <option value="5">Five</option>
</select>

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

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

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

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

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

Синтаксис

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

Answer 8

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

<option value="someValue" selected>Some Value</option>

вместо

<option value="someValue" selected = "selected">Some Value</option>

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

Answer 9

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

<select selected=''>
    <option value=''></option>
    <option value='1'>ccc</option>
    <option value='2'>xxx</option>
    <option value='3'>zzz</option>
    <option value='4'>aaa</option>
    <option value='5'>qqq</option>
    <option value='6'>wwww</option>
</select>

Answer 10

Вам просто нужно поместить атрибут «selected» в конкретную опцию, вместо того, чтобы напрямую выбирать элемент.

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

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