协慌网

登录 贡献 社区

如何设置 HTML <select> 元素的默认值?

我认为在下面的<select>元素上添加"value"属性会导致默认情况下选择包含我提供的"value"<option>

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

但是,这并没有像我预期的那样奏效。如何设置默认选择哪个<option>元素?

答案

selected="selected"为您想要的默认选项。

<option selected="selected">
3
</option>

如果您希望将默认文本作为一种占位符 / 提示但不被视为有效值(例如 “完成此处”,“选择您的国家”ecc。),您可以执行以下操作:

<select>
  <option value="" selected disabled 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>

完整的例子:

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