无需 JavaScript，通过 <button type="submit"> 的 name 和 value 属性即可实现多按钮单选提交，每个按钮自身携带选项值，表单提交时自动以键值对形式发送至服务端。
无需 javascript，通过 `
在标准 HTML 表单中，<input type="radio"> 的核心语义是「从一组互斥选项中选择一项」，而 <button type="submit"> 的核心能力是「触发表单提交并携带自定义值」。二者看似分离，实则可通过语义融合达成目标：用多个 submit 按钮替代传统 radio + 单一 submit 的组合，既保留单选逻辑（用户只能点击一个），又让每个按钮自身成为可提交的“选项载体”。
正确实现方式如下：
<form method="post" action="/process">
<button type="submit" name="item" value="item 1">
Submit Item 1
</button>
<button type="submit" name="item" value="item 2">
Submit Item 2
</button>
</form>✅ 原理说明：
- 所有 <button type="submit"> 共享相同的 name="item"，浏览器在提交时仅将被点击的按钮的 value 作为 item 字段值发送（如 item=item%201）；
- 未被点击的按钮不会出现在请求参数中，天然满足单选约束；
- 服务端（如 PHP、Node.js、Python Flask 等）只需读取 item 参数即可获知用户选择，无需额外判断来源按钮。
⚠️ 注意事项：
立即学习“前端免费学习笔记（深入）”；
- 必须显式设置 type="submit"（默认为 submit，但显式声明更安全，尤其在部分旧版浏览器或框架中）；
- 不要混用 <input type="radio"> 与 submit 按钮——这会破坏语义一致性，且无法保证点击按钮时 radio 状态同步；
- 若需视觉上高亮已选状态（如禁用其他按钮），则需 JavaScript 辅助；但纯提交逻辑完全可零 JS 实现；
- <input type="submit"> 本身不支持内嵌元素，因此不能包裹 <input type="radio">，而 <button> 支持内联内容，但此处无需嵌套 radio——<button> 自身就是更简洁、更语义化的解决方案。
? 进阶提示：
你还可以为按钮添加 CSS 类实现统一风格，或使用 formaction 属性为不同按钮指定独立提交地址（覆盖 <form> 的全局 action），进一步增强灵活性。该方案完全符合 HTML5 规范，兼容所有现代浏览器及 IE9+，是兼顾语义、可用性与后端友好性的最佳实践。
