javascript - 在 JavaScript 中克隆 FileList 对象以进行文件上传?

标签 javascript html object file-upload cloning

好的,这是我的情况。我有一个处理 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/

相关文章:

javascript - 如何将 JSONString 转换为 Javascript 对象

javascript - 使用现有函数的输出作为对象属性

xcode - 访问正在加载 sqlite 数据的我的 NSArray 对象时遇到问题

javascript - 如何使用 td id Jquery 对所有表行求和 td (TotalPrice)

html - 是否有纯HTML5或CSS3使所有外部链接离开网站,如target=_blank?

javascript - 提醒消息并重定向(或不重定向)

php - 随机版本号与图像强制缓存

html - 最佳实践 : displaying text that was input via multi-line text box

javascript - 如何缩小较大的图像,同时在 CSS 中仅显示图像的一部分(或在必要时添加 JS)?

javascript - 查找与值相等的键不起作用