获取多个文件选择的所有路径

时间:2014-03-17 12:42:00

标签: jquery html5 fileapi

我用

<input type="file" multiple="multiple" name="upload" id="id_upload" />

我只能从一个文件中获取值

 value: "C:\fakepath\2012-09-18 10.47.18.jpg"

输入.files

中没有beacause路径
 files: FileList
  0: File
   lastModifiedDate: Tue Sep 18 2012 02:47:18 GMT+0200 (Vest-Europa (sommertid))
    name: "2012-09-18 10.47.18.jpg"
    queueItem: jQuery.fn.jQuery.init[1]
    size: 1064960
    type: "image/jpeg"
    uploading: true
    webkitRelativePath: ""
    __proto__: File

如何获取所有选定文件的路径?我试图获得的是来自所选文件的EXIF数据,使用此This EXIF reader

1 个答案:

答案 0 :(得分:2)

您可以使用以下内容;

<input id="files" type="file" multiple/>
<div id="result"></div>

var filesInput = $("#files");

filesInput.on("change", function(e) {
    var files = e.target.files; //FileList object
    var result = $("#result");

    $.each(files, function(i, file) {
        var pReader = new FileReader(); 

        pReader.addEventListener("load", function(e){
            var pic = e.target;                
            result.append("<img class='thumbnail' src='" + pic.result + "'/>"); 
            show();

        });
        pReader.readAsDataURL(file);

    });


});

您可以在此处查看演示: http://jsfiddle.net/yT3PX/14 。选择文件后,可以单击imgs查看exif数据。但是,不允许在jsfiddle上获取exif数据。您可以在演示

上看到加载的多个图像