javascript - 处理多个选择的发布请求

标签 javascript html node.js

我有多个选择元素,我用一个按钮提交它们。这是一个例子:

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>Page Title</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>

</head>
<body>
    <div class="inner">
        <form method="POST" action="test"> 
            <label  name="first">first</label>
            <select style="display:inline-block">
            <option value="value1" name ="value1">test 1 </option>
            <option value="value2" name= "value2">test 2</option>

          </select>  
          <label name="second">second</label>
          <select style="display:inline-block">
            <option value="4">1</option>
            <option value="5">2</option>
            <option value="6">3</option>

          <input type="submit" value="Submit" class="button" >

          </form>
      </div>




</body>
</html>

我正在尝试使用nodejs来处理它们并表达如下:

const express = require('express');
const app  = express()
var path = require('path')
var fs = require('fs')
app.use(express.static('public'))
app.use(express.urlencoded())
console.log(__dirname)

app.get('/',function(req,res){
  res.sendFile(path.join(__dirname+'/index.html'))
})
app.post('/test', (req, res) => {
    console.log(req.body.value1)
})

app.listen(2000)

显然这是不正确的,所以我的问题是我该怎么做?

提前致谢!

最佳答案

我认为你在编写 html 时犯了错误。 首先,您必须向选择框添加名称属性,以便您可以在服务器端使用值。 其次,您没有关闭第二个选择元素。

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>Page Title</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>

</head>
<body>
    <div class="inner">
        <form method="POST" action="test"> 
          <label  name="first">first</label>
          <select style="display:inline-block" name='select_box_1'>
            <option value="value1" name ="value1">test 1 </option>
            <option value="value2" name= "value2">test 2</option>

          </select>  
          <label name="second">second</label>
          <select style="display:inline-block" name="select_box_2">
            <option value="4">1</option>
            <option value="5">2</option>
            <option value="6">3</option>
          </select>
          <input type="submit" value="Submit" class="button" >

        </form>
      </div>




</body>
</html>

关于javascript - 处理多个选择的发布请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57687576/

相关文章:

php - 提交(); Mac 的 IE/Safari/FF 中的问题

Javascript:如何使用 ajax 请求在 for 循环内以正确的顺序将对象插入数组

javascript - 在 HTML 模板中保留 & 字符代码

javascript - 如何将接收到的八位字节流作为 REST 响应保存到文件系统?

node.js - 如何在不缩小的情况下构建 React 的生产版本?

javascript - 在网站的新页面上保持事件菜单打开

html - 在 "nav ul li"类型菜单上的 ie9 中填充大于 0 时 CSS 边框消失 (symfony)

javascript - hrefs 在 ng-bind-html 之后不工作

javascript - NodeJS Passport 身份验证 - 始终重定向到失败 url

javascript - 在 if 语句中使用 Javascript 对象变量