<option>: 选项标签

最后更新：2026-10-13

<option>选项标签

select、datalist、optgroup 中的单个可选项。

<option value="apple">苹果</option>

该元素支持全局属性及以下专有属性：

编辑下方代码，在 playground 中查看实时效果：

浏览器	Chrome	Edge	Firefox	Safari	Opera
<option>	✓ v1	✓ v12	✓ v1	✓ v1	✓ v1
所有主流浏览器均支持

提示： 未写 value 时，提交的是标签之间的文字内容。

Qoption 的 value 和显示文字有什么关系？

A有 value 属性时提交的是 value 值，标签间文字只用于显示；没有 value 时提交标签间文字本身。最佳实践是始终写 value（如 <option value='bj'>北京</option>），避免后端依赖会变的显示文案。

Qoption 可以设置 disabled 吗？

A可以，<option disabled> 让该选项不可选（显示为灰色）。常见用途：分组提示行「请选择」占位项、已下架的选项。整个 optgroup 也能整体禁用。

Qoption 里可以放 HTML 吗？

A基本不行，原生 option 只渲染纯文本（部分浏览器容忍极简标记但不可靠）。需要富样式的下拉（图标、两行文字）只能用自定义组件或第三方库实现，同时记得保留无障碍属性。

更多案例即将上线，敬请期待。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。