如何使用 Node.js 显示 select 选项的值作为响应

Question

我是 Node.js 和 Express

的新手

我正在尝试从 HTML 页面的 select 列表中获取 selected 选项，并使用 node.js

显示为响应

HTML

<form name="survey" id="survey" method="post" action="/survey">
    <select name="monthofbirth">
        <option value="1">January</option>
        <option value="2">February</option>
        <option value="3">March</option>
        <option value="4">April</option>
        <option value="5">May</option>
        <option value="6">June</option>
        <option value="7">July</option>
        <option value="8">August</option>
        <option value="9">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>
    </select>
</form>

Index.JS

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

app.use(express.static('public'))

app.use(bodyParser.urlencoded({ extended: false }));

app.post('/survey', function (req, res) {
    let month = req.body.monthofbirth;
});

app.listen(3000, function () {
    console.log('Example app listening on port 3000!')
})

当我尝试使用代码 res.write(<b>${month}</b>) 打印响应时；它显示选项的值，如 1、2、3 等，但我必须显示文本，如一月、二月等。

请帮我解决这个问题:(

编辑：

我不应该更改 HTML 文档，所以我无法将选项值从 1、2、3 更改为一月、二月等；

Answer 1

客户端

使用querySelector获取value的option元素，然后获取innerText。

document.getElementById('submit').onclick = () => {
  const select = document.querySelector("select[name='monthofbirth']")
  const value = select.value;
  const option = select.querySelector(`option[value='${value}']`)
  const text = option.innerText
  console.log(text)
}

<form name="survey" id="survey" onSubmit='return false'>
  <select name="monthofbirth">
    <option value="1">January</option>
    <option value="2">February</option>
    <option value="3">March</option>
    <option value="4">April</option>
    <option value="5">May</option>
    <option value="6">June</option>
    <option value="7">July</option>
    <option value="8">August</option>
    <option value="9">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
  </select>

  <button id='submit'>Submit</button>
</form>

服务器端

创建地图或对象，使用字符串或数字作为键。

const monthNames = {
  '1': 'January',
  '2':'February',
   // etc
}

res.write(`<b>${monthNames[month]}</b>`);

第 3 方库

您还可以使用第 3 方库不仅获取名称，还获取特定于区域设置的名称。

https://momentjs.com/

https://github.com/moment/moment/issues/2433

Answer 2

这是正常的，因为附加到每个选项的值是数字 (1,2,3,4, ...12)，如果你想获得月份名称，你必须更改你的 select 选项，例如这个

<select name="monthofbirth">
    <option value="January">January</option>
    <option value="February">February</option>
    <option value="March">March</option>
    <option value="April">April</option>
    <option value="May">May</option>
    <option value="June">June</option>
    <option value="July">July</option>
    <option value="August">August</option>
    <option value="September">September</option>
    <option value="October">October</option>
    <option value="November">November</option>
    <option value="December">December</option>
</select>

Answer 3

最简单的方法是让值代表您尝试使用的月份。是否有理由将值作为月份编号而不是名称？

如何使用 Node.js 显示 select 选项的值作为响应

How to display the value of select option as response using Node.js

node.js

express

body-parser

客户端

服务器端

第 3 方库