req.body 未使用 JQuery 定义答案

【问题标题】：req.body is undefined with JQueryreq.body 未使用 JQuery 定义
【发布时间】：2022-01-01 22:22:54
【问题描述】：

我想使用 express 和 jquery 实现 AJAX。

index.ejs

<script>
const increment = () => {
    let value = parseInt(document.getElementById('number').value);
    value = isNaN(value) ? 0 : value;
    value++;
    document.getElementById('number').value = value;
    console.log(document.getElementById('number').value) <== returns correct number
}
</script>
<button type="button" onclick='increment()'>add</button>
<form action="/dash" method="POST" id="mon">
    <input id="number" name='number' value=<%=money %>>
    <button type="submit">submit</button>
</form>

index.js

router.post('/dash', isLogin, async (req, res) => {
    const num = req.body.number;
    const filter = {username: req.user.username};
    const update = {money: num};
    await User.updateOne(filter, update);
    console.log(num) <== also returns correct number
    res.redirect('/dash')
})

而且，当单独（没有 jquery）时，它工作得很好，它返回正确的数字并将其保存到 db。

当我将 jquery 代码添加到脚本时出现问题。

index.ejs的script标签中的JQuery代码：

$(document).ready(function () {
        $("form#mon").on('submit', function (e) {
            e.preventDefault();
            var data = $('input[name=number]').val();
            console.log(data)
            $.ajax({
                type: 'post',
                url: 'dash',
                data: data,
                dataType: 'text',
            })
                .done(function (data) {
                    var num = $('input[name=number]').val();
                    console.log(num)
                    $('input[name=number]').val(num);
                });
        });
    });

而且基本上它也可以，点击按钮时不会刷新页面，但现在index.js中的console.log(req.body.number)返回未定义，并且不会保存在db中。

感谢您的回答。

【问题讨论】：

标签： javascript jquery node.js express

【解决方案1】：

表单数据由一系列 key=value 对组成。

你有：

var data = $('input[name=number]').val();

因此，您发送的数据是 one 值，带有 no 键。

你需要：

var data = {
    number: $('input[name=number]').val();
};

【讨论】：

成功了，谢谢！