如何更简洁地判断POST请求中Button A或Button B是否被按下？

1. 客户端HTML配置 #

不需要给按钮设置value属性，只需要给每个按钮设置唯一的name属性并指定类型为submit：

<form method="POST" action="/submit">
  <button type="submit" name="btnA">Button A</button>
  <button type="submit" name="btnB">Button B</button>
</form>

用户点击某个按钮时，浏览器会自动将该按钮的name字段（值通常为空字符串，部分浏览器会用按钮文本，但核心是该字段会出现在请求体中）加入POST请求，未被点击的按钮不会出现在请求体里。

2. Node.js服务端判断逻辑 #

只要框架能解析POST请求体（比如Express用express.urlencoded()中间件），直接检查请求体中是否存在对应按钮的name字段即可：

Express示例 #

const express = require('express');
const app = express();

// 解析x-www-form-urlencoded类型的请求体
app.use(express.urlencoded({ extended: true }));

app.post('/submit', (req, res) => {
  if ('btnA' in req.body) {
    // Button A被点击
    res.send('Button A triggered');
  } else if ('btnB' in req.body) {
    // Button B被点击
    res.send('Button B triggered');
  } else {
    // 无按钮被触发（比如通过其他方式提交表单）
    res.send('No button triggered');
  }
});

app.listen(3000);

补充说明 #

• 请求体仅包含被点击按钮的name：比如点击Button A，req.body会是{ btnA: '' }（浏览器略有差异，但字段存在是确定的），所以只需判断字段是否存在，不用依赖具体值。
• 按钮信息只会出现在请求体中，HTTP头不会携带按钮名称，无需通过头信息判断。
• 若用AJAX提交（如fetch、axios），只需在提交时携带被点击按钮的name字段即可：

// AJAX提交示例
document.querySelector('button[name="btnA"]').addEventListener('click', (e) => {
  e.preventDefault();
  fetch('/submit', {
    method: 'POST',
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    body: new URLSearchParams({ btnA: '' })
  });
});

3. 核心原理 #

HTML表单的默认行为是：只有被点击的submit类型按钮会被纳入请求体（无论是否设置value），因此我们可以通过检查请求体中是否存在对应按钮的name字段来判断触发源，完全不需要依赖value属性。

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