如何在Express的app.get中获取下拉选择框的选中值？

嘿，我来帮你搞定这个问题！你目前的代码有几个关键小问题，咱们一步步调整就能实现需求：

首先，修正HTML部分的表单结构 #

你的下拉选择框需要放在<form>标签里，这样提交时才能把选中的值传递给Express路由。另外，<option>标签不需要加name属性，选中的值会通过<select>的name属性（也就是你设置的dc）来传递。修改后的HTML代码如下：

<form action="/myform" method="GET">
  <select id="dcVal" class="custom-select my-1 mr-sm-2" name="dc" required>
    <option selected value="">Choose...</option>
    <% data.forEach(function(datas){ %>
      <option value="<%= datas.xyz %>"><%= datas.xyz %></option>
    <% });%>
  </select>
  <!-- 别忘了加提交按钮，不然没法触发表单提交 -->
  <button type="submit" class="btn btn-primary">Submit</button>
</form>

然后，调整Express的路由逻辑 #

你现在用的是app.get，但却尝试从req.body里取参数——这是不对的！GET请求的表单参数会附加在URL的查询字符串里，所以应该用req.query来获取，而不是req.body（req.body是用来处理POST请求参数的）。修改后的Node.js代码：

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

app.get('/myform', function(req, res){
  // 从req.query里获取名为dc的参数
  var dcVal = req.query.dc;
  res.send('Your selected value: ' + dcVal);
});

app.listen(3000, () => {
  console.log('Server is running on port 3000!');
});

额外补充：如果想用POST请求的情况 #

如果你更倾向于用POST方式传递参数（更适合敏感数据，参数不会暴露在URL里），可以这样改：

修改HTML的表单method #

<form action="/myform" method="POST">
  <!-- 下拉框部分和之前一致 -->
  <button type="submit">Submit</button>
</form>

调整Express代码（需要配置body-parser） #

var express = require('express');
var bodyParser = require('body-parser');
var app = express();

// 配置body-parser来解析表单格式的数据
app.use(bodyParser.urlencoded({ extended: false }));

app.post('/myform', function(req, res){
  // 这时就可以用req.body获取参数了
  var dcVal = req.body.dc;
  res.send('Your selected value: ' + dcVal);
});

app.listen(3000, () => {
  console.log('Server is running on port 3000!');
});

关键要点总结 #

• GET请求的参数存在req.query中，POST请求的参数存在req.body中（POST需要配置body-parser）
• 下拉框必须包裹在<form>标签内，指定正确的method和action路由
• <select>的name属性是参数传递的关键，后端通过这个名称来获取值

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