javascript - 如何使用 JavaScript 从文件对话框中捕获文件选择？

Question

我使用下面的代码使用java脚本创建一个文件对话框

var input = $(document.createElement('input'));
input.attr("type", "file");
input.trigger('click');

使用上述代码可以正确显示文件对话框。

如果使用“文件对话框”上的“打开”按钮选择文件，如何捕获文件名和其他详细信息？

使用已选择的文件我想使用ajax请求将所选文件上传到服务器

我尝试了如下几个选项来捕获“打开”按钮的点击。但这没有帮助。有什么建议吗？

input.onchange = function(e) {
alert("File Selected"); 
};  

input.onclick = function(e) {
alert("File Selected");
};

Answer 1

file输入有一个名为 files 的特殊属性。您可以按如下方式访问它们(作为数组，如果您指定了 multiple 属性):

var files = input.files;

MDN documentation状态:

An object of this type is returned by the files property of the HTML <input> element; this lets you access the list of files selected with the <input type="file"> element. It's also used for a list of files dropped into web content when using the drag and drop API; see the DataTransfer object for details on this usage.