javascript - 使用javascript获取文件输入？

Question

我在 HTML 中有这一行:

<input class="input-file" type="file" id="input-recipe-pic"> 

在用户选择要上传的文件并按下提交按钮后，我试图从上面的文件输入标签中获取他们选择的文件。如何使用 javascript 获取文件，以便稍后通过 AJAX 发送它以避免重新加载页面？

Answer 1

在 HTML5 文件 API 出现之前，如果没有 iframe hack，这是不可能的。使用 HTML5 文件 API，您可以做

$(".input-file").change(function() {
    var file = this.files[0];
    var reader = new FileReader();
    reader.onload = function() {
        alert(reader.result);
    };
    reader.readAsText(file);
});

请注意，这仅适用于支持 HTML5 File API 的浏览器，例如 Chrome。