好的,这是我的情况。我有一个处理 AJAX 表单提交和其他相关同步和异步请求的 JavaScript 类。它收集数据,然后将此数据设置为请求的临时存储,然后使用临时存储数据发出请求。
例如:
- 用户开始构建请求,将 NAME 和 LAST NAME 放入表单
- 此数据放入对象变量 SUBMITDATA
- 当发出请求时,此数据被克隆到另一个变量 TEMPSUBMITDATA
- 一旦请求完成,用于发出请求的数据仍然可用(用于调试或其他目的)
这意味着如果两个请求同时通过同一个对象进行,那么我仍然可以访问用于发出这些请求的数据。
一切都按预期工作,直到我想使用 HTML5 FileList 和 FormData。虽然我可以相对轻松地在 JavaScript 中克隆对象,但我无法克隆 FileList。这是一个例子:
<html>
<head>
<script type="text/javascript">
// This method is used to clone data objects
function clone(object){
if(object==null || typeof(object)!=='object'){
return object;
}
// This line throws the error when FileList data is attempted to be cloned
var tmp=object.constructor();
for(var key in object){
tmp[key]=clone(object[key]);
}
return tmp;
}
// This is an example data storage
var submitData=new Object();
submitData['some-data']='abc';
function uploader(files){
submitData['my-files']=files;
// This clones the object and leads to the error because of FileList
var tempSubmitData=clone(submitData);
// HERE WOULD THE ACTUAL FORM SUBMIT HAPPEN
// THIS EXAMPLE IS SHOWN FOR EASIER READING OF
// THE PROBLEM EXPLAINED ABOVE
}
</script>
</head>
<body>
<input type="file" name="myfile" value="" onchange="uploader(this.files);"/>
</body>
这引出了我的问题,我能否——完全——以任何方式克隆这种类型的数据,以便我可以存储它直到请求完成?或者真的是每次都创建一个新对象的唯一方法吗?
新的对象解决方案对我来说并不好,因为我的类像一个单独的应用程序一样工作,它有一个日志和其他数据,这些数据对以后的请求跟踪很有用,而且它在每种情况下都工作得很好——直到现在我迷路了在使用 HTML5 FileList 和 FormData 时。
如有任何帮助,我们将不胜感激!
最佳答案
如果您正在使用 jQuery
,您可以使用 extend
方法来克隆这样的对象。
var clonedObject = $.extend(true,{},yourObject);
如果你不是,也许你可以在这种情况下使用原生 Object.create()
var clonedObject = Object.create(yourObject);
最后一个不是副本(而是一个空对象,具有前一个对象的属性和功能作为其原型(prototype)的一部分,如果我没记错的话),但它很相似,我认为在这种情况下它对你有用。
关于javascript - 在 JavaScript 中克隆 FileList 对象以进行文件上传?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14438456/