时间戳

首页 > 解决方案 > 在客户端保存 Javascript FormData() 对象

javascript - 在客户端保存 Javascript FormData() 对象

问题描述

我有一个 html 页面，其中包含一个带有一些文本和文件输入元素的表单元素。
这是使用此处建议的方法通过 ajax 调用向服务器提交的：如何异步上传文件？
正如您在上述链接的引用页面中看到的那样，FormData()对象用作输入数据的容器，我已经成功完成了这项工作。
但是现在我们想创建一个包含这些 html 元素的新页面，将文本和文件输入保存在客户端（Cookie 或 Local Strorage 或......），稍后在另一个页面上进行 ajax 提交。
我无法保存新的 FormData()在 cookie 或本地存储中；保存的是一个小字符串：“[object FormData]”，而不是输入的文件和字符串。
我也尝试使用 JSON.stringify() 没有成功；它只是返回了一个空的 JSON("{}")。
（代码使用 jQuery 选择器）

var postData = new FormData($(form)[0]);
// var sPostedData = JSON.stringify(postData); // returns: "{}"
var myStorage = window.localStorage; // returns: "[object FormData]"
myStorage.setItem("contentOrder", postData);

请帮忙，我应该如何在我的客户端保存这个对象？

标签： javascripthtmlcookieslocal-storageclient-side

解决方案

要从表单数据中获取文件，请使用formData.get('file')wherefile是输入的名称。返回的对象将是 Blob 类型（请参阅如何获取其内容）。

完整的例子可以在这个小提琴中找到：https ://jsfiddle.net/skm5m467/1/

推荐阅读