无需JavaScript，能否将HTML表单按钮与单选输入框结合？

你那两种写法都不符合HTML规范，没法正常工作：

• <input type="submit">是自闭合元素，不能嵌套任何标签，浏览器会自动修正这种错误结构，导致radio和submit的关联失效；
• <button>内部不能包含<input>这类表单控件，同样会被浏览器解析出错。

不用JavaScript完全可以实现你的需求，直接给每个提交按钮设置相同的name和对应的value即可，点击某个按钮时，它的name和value会被一起提交到服务器：

<form method="post" action="/process">
  <input type="submit" name="item" value="item 1">
  <input type="submit" name="item" value="item 2">
</form>

服务器端只需要读取item参数的值，就能知道用户点击的是哪个按钮（值为item 1或item 2）。

如果想要类似单选框的视觉样式（比如按钮旁带选中标记），可以配合隐藏的单选框和<label>，再用CSS调整样式，同样不需要JS：

<form method="post" action="/process">
  <div>
    <input type="radio" id="item1" name="item" value="item 1" hidden>
    <label for="item1">
      <input type="submit" value="Submit Item 1">
    </label>
  </div>
  <div>
    <input type="radio" id="item2" name="item" value="item 2" hidden>
    <label for="item2">
      <input type="submit" value="Submit Item 2">
    </label>
  </div>
</form>

这种写法既保留了单选框的互斥逻辑（如果需要的话），又能通过点击按钮提交对应的值，不过第一种方案已经完全满足你“点击按钮传递信息到服务器”的核心需求，更简洁。

内容的提问来源于stack exchange，提问作者Slevin