在HTML/Blazor Select（下拉框）的Foreach循环中设置默认值

实现方案 #

方案1：服务端渲染时直接加选中属性（推荐）

你只需要提前拿到需要默认选中的目标值（可以是固定值、Model里的字段、ViewData传值等），在循环渲染option时做等值判断，匹配就输出selected属性即可，示例代码如下：

@{
    // 替换为你实际的默认选中值，比如可以从Model.SelectedOption、ViewData["Selected"]等位置取值
    var defaultSelectedValue = "你要默认选中的选项内容";
}
<select class="form-control" style="width: 160px" id="id">
@foreach (var option in Function())
{
    <option @(option == defaultSelectedValue ? "selected" : "")>@option</option>
}
</select>

如果你的Function()返回的是带独立值和显示文本的复合对象（比如SelectListItem、自定义类，包含Value和Text两个属性），可以按以下写法调整：

<select class="form-control" style="width: 160px" id="id">
@foreach (var option in Function())
{
    <option value="@option.Value" @(option.Value == Model.DefaultSelectedValue ? "selected" : "")>@option.Text</option>
}
</select>

方案2：前端JS动态赋值

如果你不想修改服务端渲染逻辑，可以在页面加载完成后用JS直接给select设置值：

// 页面DOM加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
    // 替换为你要默认选中的值
    document.getElementById('id').value = '默认选中的选项值';
});

内容的提问来源于stack exchange，提问作者maxba