单选框
Radio
初级通用单选框（Radio）是表单中一组互斥的选项，用户选中一个时，同组其他选项会取消选中。它解决的是「只能选一个」且希望用户直接看见全部候选项的问题，比如选择订单的配送方式。
你可能会说：「我想把几个配送方式都摆出来，让用户只能选其中一个，点新的就取消之前选的。」
动手看看订单配送方式选择
选择配送方式每笔订单只能选择一种配送方式
快递配送预计 2–3 天送达 · 运费 ¥8
到店自取今天 18:00 后可取 · 免运费
配送方式
切换下方的「配送方式」参数，依次看未选择、快递配送和到店自取；也可以悬停、按住或用 Tab 聚焦选项，感受交互反馈。
快递配送的圆点和边框亮起，明确告诉你当前选的是它；到店自取仍保持未选中。
要点单选框怎样表达一次选择？
- 1
同一组里只能选中一个
你可以把「快递配送」和「到店自取」放在同一组。用户选了到店自取，快递配送就会取消选中。因为它们回答的是同一个问题，所以界面和表单数据里都只保留一个答案。
- 2
组名和选项文字各有作用
组名告诉用户正在回答什么，例如「配送方式」；每个选项旁的文字说明具体答案。这样用户扫一眼就能理解，也方便使用键盘或读屏工具的人辨认和选择。
- 3
初始状态取决于业务含义
如果必须选配送方式，你可以提供合理的默认值，或让用户提交前自己选。若允许不选，想好选中后如何恢复到「不选」：可以增加「暂不选择」选项，因为单选框通常不能靠再次点击来取消。
容易混淆的地方
单选框和复选框的关键区别是选择数量：一组配送方式只能取一个，用单选框；订阅哪些通知可以同时选多个，用复选框。它和下拉选择器也都能实现单选，但单选框会把选项直接摆出来；选项很多、展示空间有限时，下拉选择器通常更合适。
什么时候用
适合用
- 在结算页选择「快递配送」或「到店自取」，两种方式互斥，而且用户需要直接比较。
- 在 AI 工具的设置页选择本次生成的输出格式，候选项少，且一次只采用一种格式。
- 在后台新建活动时选择一个发布范围，让运营人员提交前看清所有可选范围。
不适合用
- 用户可以同时订阅邮件和站内通知时，选择并不互斥，改用复选框。
- 让用户从数百个客户名称中选一个时，全部摆成单选框很难查找，改用可搜索的选择器。
- 只是让用户打开配送说明页面时，这不是在填写表单，改用链接。
练一练选一个答案，看看解释
你在做一个结算页，用户只能选择快递配送或到店自取，两个选项都要直接展示。该怎么设计？
让 AI 帮你做复制给 AI Agent 直接用
请在结算表单中加入一组单选框，组名为「配送方式」，选项是「快递配送」和「到店自取」，同一时间只能选一个。提交时传递选中的方式；请给选项配上可点击的文字标签，并处理未选择时的表单校验。