构造函数未从窗体获取任何值



我一定犯了一个非常愚蠢的错误,但我无法弄清楚为什么这不起作用:

<html>
    <head>
        <title>Form test</title>
    </head>
    <body>
        <h1>Test a form</h1>
        <form id="myform" name="myform" action="/server">
            <input type="text" name="username" value="johndoe">
            <input type="number" name="id" value="123456">
            <input type="submit" onclick="return sendForm(this.form);">
        </form>
        <script>
            function sendForm(form) {
                var formData = new FormData(form);
                console.log("as json: " + JSON.stringify(formData));
                return false; // Prevent page from submitting.
            }
        </script>
    </body>
</html>

根据 FormData 的文档,如果您在构造函数中给它一个表单对象,它将用表单值填充自身,但是当我这样做时,我在控制台中得到一个空结果。知道我在这方面做错了什么吗?我在Chrome和Firefox中都尝试过,并得到了相同的结果。这是基于html5rocks XHR2中的示例。

谢谢

你在这里没有做错任何事。您需要使用 .entires().get().getAll()等方法来访问值或键。我前段时间遇到了同样的问题,如果您需要将FormData转换为 JSON,则需要编写一些代码,为您执行此操作,JSON.stringify() 在这种情况下不起作用。看看这里

或者,如果你需要一个jQuery解决方案:SO

我想出了我需要做什么。很简单:

console.log("Here it is: " + JSON.stringify($('#myform').serializeArray()[0]));

给出预期结果:包含表单中的名称/值对的 JSON 字符串。然后,我可以使用XMLHttpRequest发送此内容。在这种情况下,没有理由使用 FormData 对象。

最新更新