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

How to capture file selection from a file dialog box using javascript?

本文关键字：文件 选择 对话框 javascript 何使用      更新时间：2023-09-26

我使用以下代码使用 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");
};

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

var files = input.files;

MDN 文档指出：

此类型的对象由 HTML 的文件属性返回 <input>元素;这使您可以访问使用 <input type="file">元素。它也用于文件列表 使用拖放 API 时放入 Web 内容;请参阅该 DataTransfer对象以获取有关此用法的详细信息。

相关文章：