javascript - 显示 "wrong"值的 HTML 选择选项

Question

在 express 中，我正在渲染一个 handlebar 模板，用值填充一个表单。

为了填充我的选择选项，我设置了我的选择节点的“值”属性，如下所示:

<select class="inputField" name="gender" value="female">
    <option value="male">Männlich</option>
    <option value="female">Weiblich</option>
</select>

虽然在视觉上选择了男性选项。谁能解释为什么会这样？

编辑 1:

我知道 selected 属性，但它在模板化时让事情变得更复杂，所以我宁愿传递选定的值。

但更准确地说是我原来的问题:

为什么会这样:

var genderEl = document.getElementById('genderSelect');
    genderEl.value = "female";

Answer 1

在选择输入中预选选项的正确方法是:

<select class="inputField" name="gender">
    <option value="male">Männlich</option>
    <option value="female" selected>Weiblich</option>
</select>

如果您使用的是 xhtml 或 html4，则应将 selected 更改为 selected="selected"