动态设置文件输入值[重复]

This question already has an answer here:

这个问题已经有了答案:

How to set file input value when dropping file on page? [duplicate] 1 answer
如何设置在页面上删除文件时的文件输入值?【复制】1回答
How to set File objects and length property at FileList object where the files are also reflected at FormData object? 1 answer
如何在文件列表对象中设置文件对象和长度属性，其中文件也反映在FormData对象中?1回答

Is there a way to set the value of a file input (<input type="file" />) or is that all blocked for security? I'm trying to use google gears' openFiles to make a simple multi-uploader.

是否有一种方法可以设置文件输入的值()，还是为了安全而全部阻塞?我正在尝试使用谷歌gears的openFiles来制作一个简单的多上传程序。

Note:

注意:

The answer(s) below reflect the state of legacy browsers in 2009. Now you can actually set the value of the file input element dynamically/programatically using JavaScript in 2017.

下面的答案反映了2009年遗留浏览器的状况。现在，您可以在2017年使用JavaScript动态/程序化地设置文件输入元素的值。

See the answer in this question for details as well as a demo:
How to set file input value programatically (i.e.: when drag-dropping files)?

有关详细信息和演示，请参见这个问题的答案:如何程序化地设置文件输入值(即。:当拖放文件)?

4 个解决方案

#1

It is not possible to dynamically change the value of a file field, otherwise you could set it to "c:\yourfile" and steal files very easily.

动态更改文件字段的值是不可能的，否则可以将其设置为“c:\yourfile”并很容易地窃取文件。

However there are many solutions to a multi-upload system. I'm guessing that you're wanting to have a multi-select open dialog.

然而，多上传系统有很多解决方案。我猜你想要一个多选择的开放对话框。

Perhaps have a look at http://www.plupload.com/ - it's a very flexible solution to multiple file uploads, and supports drop zones e.t.c.

也许可以看看http://www.plupload.com/——这是一个非常灵活的解决方案，可以支持多个文件上传，并支持drop zone e.t.c。

#2

I am working on an angular js app, andhavecome across a similar issue. What i did was display the image from the db, then created a button to remove or keep the current image. If the user decided to keep the current image, i changed the ng-submit attribute to another function whihc doesnt require image validation, and updated the record in the db without touching the original image path name. The remove image function also changed the ng-submit attribute value back to a function that submits the form and includes image validation and upload. Also a bit of javascript to slide the into view to upload a new image.

我正在开发一个有棱角的js应用程序，并遇到了类似的问题。我所做的就是从数据库中显示图像，然后创建一个按钮来移除或保留当前图像。如果用户决定保留当前图像，我将ng-submit属性更改为另一个不需要图像验证的函数，并在db中更新记录，而不触及原始的图像路径名。删除图像函数还将ng-submit属性值更改为提交表单并包含图像验证和上传的函数。还需要一点javascript来将这个视图滑到视图中以上传一个新的图像。

#3

I had similar problem, then I tried writing this from JavaScript and it works! : referenceToYourInputFile.value = "" ;

我也遇到过类似的问题，然后我试着从JavaScript编写它，它成功了!:referenceToYourInputFile。值= " ";

#4

I ended up doing something like this for AngularJS in case someone stumbles across this question:

我为AngularJS做了这样的事情以防有人遇到这个问题:

const imageElem = angular.element('#awardImg');

if (imageElem[0].files[0])
    vm.award.imageElem = imageElem;
    vm.award.image = imageElem[0].files[0];

And then:

然后:

if (vm.award.imageElem)
    $('#awardImg').replaceWith(vm.award.imageElem);
    delete vm.award.imageElem;

#1