我遇到了这个问题，但这个被接受的、高度支持的答案对我来说不起作用。事实证明，如果你使用的是React，那么设置selected就不起作用了。

相反，您必须直接在＜select＞标记中设置一个值，如下所示：

<select value="B">
  <option value="A">Apple</option>
  <option value="B">Banana</option>
  <option value="C">Cranberry</option>
</select>

在React页面上阅读更多关于原因的信息。

我使用Angular，并通过以下方式设置默认选项

HTML模板

<select #selectConnection [(ngModel)]="selectedVal" class="form-control  col-sm-6 "  max-width="100px"   title="Select" 
      data-size="10"> 
        <option  >test1</option>
        <option >test2</option>      
      </select>

脚本：

sselectedVal:any="test1";

您可以使用：

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

而不是

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

两者同样正确。

另一个例子；使用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);

我遇到了这个问题，但这个被接受的、高度支持的答案对我来说不起作用。事实证明，如果你使用的是React，那么设置selected就不起作用了。

相反，您必须直接在＜select＞标记中设置一个值，如下所示：

<select value="B">
  <option value="A">Apple</option>
  <option value="B">Banana</option>
  <option value="C">Cranberry</option>
</select>

在React页面上阅读更多关于原因的信息。

我更喜欢这样：

<select>
   <option selected 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>

选择选项后，“选择此处”消失。