javascript [object FormData]中的警报特定元素（用于测试）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13662875/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Alert specific element in [object FormData] (for testing)
提问by don
I'm trying to see what content is contained inside an [object FormData], and in particular inside a specific element whose name should be Name. I would like to alert it, to check if the content is correct, but doing so returns undefined:
我正在尝试查看 中包含哪些内容[object FormData]，尤其是名称应为Name. 我想提醒它，检查内容是否正确，但这样做会返回undefined：
alert(fd['Name']);
I'm pretty sure I'm loading the form data correctly, so I was wondering if the problem is that I'm accessing the data in the wrong way...
我很确定我正确加载了表单数据，所以我想知道问题是否是我以错误的方式访问数据......
PS alerting only fdreturns [object FormData]
PS警报仅fd返回[object FormData]
回答by Asad Saeeduddin
IvanZh informed me that this approach did not work for him, which prompted me to do some research into the HTML5 FormDataobject. As it turns out, I was totally wrong about this (see old incorrect answer below). All of the data for FormDataresides in nativecode. That means the browser handles the data for the form fields and file uploads in the language of its implementation.
IvanZh 告诉我这种方法对他不起作用，这促使我对 HTML5FormData对象进行了一些研究。事实证明，我对此完全错了（请参阅下面的旧错误答案）。的所有数据都FormData驻留在本机代码中。这意味着浏览器以其实现的语言处理表单字段和文件上传的数据。
Quoting MDN:
引用MDN：
Note: ... FormData objects are not stringifiable objects. If you want to stringify a submitted data, use the previous pure-AJAX example. Note also that, although in this example there are some file fields, when you submit a form through the FormData API you do not need to use the FileReader API also: files are automatically loaded and uploaded.
注意：... FormData 对象不是可字符串化的对象。如果要对提交的数据进行字符串化，请使用前面的纯 AJAX 示例。另请注意，虽然在此示例中有一些文件字段，但当您通过 FormData API 提交表单时，您也不需要使用 FileReader API：文件会自动加载和上传。
There is no way to represent this information in JavaScript, so my naive suggestion to simply serialize it as JSON will not work (which prompts me to wonder why this answer was accepted in the first place).
没有办法在 JavaScript 中表示这些信息，所以我天真的建议将它简单地序列化为 JSON 是行不通的（这让我想知道为什么这个答案首先被接受）。
Depending on what you are trying to achieve (eg. if you're only trying to debug), it might be feasible to simply bounce this information off a server side script that returns relevant JSON metadata. In PHP, for example, you could send your FormData to analyzeForm.php, which can easily access everything that you attached to FormData under the relevant request superglobal. The script would digest the contents of your form and return relevant information in easy to parse JSON. This is very inefficient, so it is probably not suitable for production environments, but it's something.
根据您要实现的目标（例如，如果您只是尝试调试），可以简单地从返回相关 JSON 元数据的服务器端脚本中返回此信息。例如，在 PHP 中，您可以将您的 FormData 发送到analyzeForm.php，它可以轻松访问您在相关请求超全局下附加到 FormData 的所有内容。该脚本将消化您的表单内容并以易于解析的 JSON 返回相关信息。这是非常低效的，所以它可能不适合生产环境，但它是一些东西。
Old incorrect answer:
旧的错误答案：
You could try using:
您可以尝试使用：
alert(JSON.stringify(fd));
to view a textual representation of the structure of fd.
查看 的结构的文本表示fd。
You could also use console.log, but this is a non-standard feature and is not guaranteed to be present in all browsers.
您也可以使用console.log，但这是一项非标准功能，不能保证在所有浏览器中都存在。
回答by user1063287
User Spokey put me on to this technique using jsFiddle herewhich has been very handy in being able to "see" the values in a formData object, the basic logic being:
用户 Spokey 让我在这里使用 jsFiddle 使用这项技术，它非常方便地能够“查看” formData 对象中的值，基本逻辑是：
function submitFormFunction() {
//create formData object
var myFormData = new FormData();
// get the values from some input fields
var myKey1 = $("input[name='my_field_one']").val();
var myKey2 = $("input[name='my_field_two']").val();
// append the values to the formData object, whilst also defining their key names
myFormData.append("my_field_one",myKey1);
myFormData.append("my_field_two",myKey2);
// mock implementation - in order to view what is being sent
var xhr = new XMLHttpRequest;
xhr.open('POST', '/echo/html/', true);
xhr.send(myFormData);
}
Just keep the 'Net' tab open in Firebug and you will be able to see the values.
只需在 Firebug 中保持“网络”选项卡打开，您就可以看到这些值。
回答by gideon
You should do:
你应该做：
console.log(fd['Name']);
And in most browsers, especially chrome you open Developer tools (F12) and see the console.
在大多数浏览器中，尤其是 chrome 中，您可以打开开发人员工具 (F12) 并查看控制台。
You'll get a nice expandable view of your object and you can inspect it.
您将获得一个很好的对象可扩展视图，并且可以对其进行检查。
