在我知道的所有浏览器中,第一个选项在下面的 HTML 中被默认选择:
<select>
<option>foo</option>
<option>bar</option>
</select>
但是我可以指望这种行为吗?或者,即使它是第一个选项,明确指定默认值是否会更好,即这样做会更安全:
<select> <option selected>foo</option> <option>bar</option> </select>
在我知道的所有浏览器中,第一个选项在下面的 HTML 中被默认选择:
<select>
<option>foo</option>
<option>bar</option>
</select>
但是我可以指望这种行为吗?或者,即使它是第一个选项,明确指定默认值是否会更好,即这样做会更安全:
<select> <option selected>foo</option> <option>bar</option> </select>
HTML(5) 规范没有说如果没有selected
属性存在,默认选择的选项应该是第一个。
选项元素的选择是一个布尔状态,最初为假。除非另有说明,否则在创建元素时,如果元素具有 selected 属性,则必须将其选中状态设置为 true。每当添加选项元素的 selected 属性时,必须将其选中状态设置为 true。
然而,它确实说如果没有selected
值存在,那么默认值应该是返回 -1 的选择值。
selectedIndex IDL 属性在获取时必须以树顺序返回选项列表中的第一个选项元素的索引,该选项的选择性设置为 true(如果有)。如果没有,那么它必须返回 -1。
我猜你因此不应该假设第一个选项将始终被选为默认选项。
我不认为这很重要。仅当您没有在顶部设置默认值时。“选定”是如果您想更改默认选项。如果你没有在上面。
像这样:
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option value="audi" selected>Audi</option>
</select>
在第一次渲染时(或者可能在<select>
创建元素时),第一个<option>
被隐式选择:selectedIndex
返回0,并且selected
(第一个选项)返回true。
但是,如果您使用 JavaScript 更改选项,例如删除所有选项并添加新选项,则selectedIndex
返回-1,并且selected
(第一个选项)返回false。
当然,以上所有假设selected="selected"
都从未使用过该属性。
所以,如果你是动态添加选项,并且想使用第一个被初始选中的,那么你必须使用 selected 属性。