如何从“多重输入”中的FileReader函数获取文件名?

罗杰·冈萨雷斯

我有以下代码:

<input type="file" multiple='multiple'>
<div id="thumbs"></div>

<script type="text/javascript">
    $('input[type="file"]').change(function() {
    $('#thumbs').html('');
    $.each(this.files, function() {
    readURL(this);
 })
});

function readURL(file) {
    var reader = new FileReader();
    reader.onload = function(e) {
    $('#thumbs').append('<img src="' + e.target.result + '" width="20%">')
    $('#quantity').text(i)
  }
  reader.readAsDataURL(file);
}
</script>

这是一个多上传输入。当我选择“ x”张图片时,它会为它们创建缩略图。可以正常工作,但是我想知道如何获取文件名(如果图片名为“ sun.jpg”,我想要获取“ sun”),然后将其附加到图片中。我已经试过了:

$('#thumbs').append('<img src="' + e.target.result + '" width="20%"><p>'+e.name+'</p>')

但是e.nameundefined

这是一切的小提琴:https : //jsfiddle.net/ugs6rzqx/1/

任何帮助,将不胜感激。谢谢。

丹达维斯

FileReader的事件对象对文件的详细信息比较苗条。在回调内部,您可以到达普通的File对象,该对象仍然具有所有文件元信息,例如名称,日期和大小。

您的代码只需要使用file而不是e

$('#thumbs').append('<img src="' + e.target.result + '" width="20%"><p>'+file.name+'</p>')

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何从Javascript FileReader获取文件名?

来自分类Dev

如何从标准输入中获取文件名

来自分类Dev

角度:FileReader-从列表中获取文件名

来自分类Dev

从FileReader对象获取文件名

来自分类Dev

如何使用jQuery从输入类型文件中获取选定的文件名和文件路径

来自分类Dev

如何遍历文件夹并将文件名输入到函数中

来自分类Dev

我如何从dos asm中的用户输入中获取文件名

来自分类Dev

我如何从dos asm中的用户输入中获取文件名

来自分类Dev

如何在继承的文件的装饰器函数中获取python文件名

来自分类Dev

如何使用 glob() 函数获取上传的文件名?

来自分类Dev

如何在ffmpeg的输出文件名中包含输入文件名

来自分类Dev

如何在Perl中从文件名获取文件句柄?

来自分类Dev

如何从Android中的文件路径获取文件名

来自分类Dev

如何从文件字段中获取文件名?

来自分类Dev

如何使用PowerShell中的文件内容获取文件名

来自分类Dev

Golang如何在Go中读取输入文件名

来自分类Dev

如何从图库中挑选的图像中获取文件名?

来自分类Dev

hadoop map reduce程序中如何在映射器代码中获取输入文件名

来自分类Dev

从图像路径(从函数)获取文件名

来自分类Dev

如何基于JavaScript中的事件对象获取文件名?

来自分类Dev

如何获取目录中的所有文件名?

来自分类Dev

如何在python中获取Windows短文件名?

来自分类Dev

如何从inotifywait事件中获取文件名?

来自分类Dev

如何在Mocha Reporter中获取测试文件名

来自分类Dev

如何使用Java在Windows中获取短文件名?

来自分类Dev

如何在Django中获取上传的文件名

来自分类Dev

如何从PHP请求中获取引用文件名

来自分类Dev

如何在Bash中获取文件名的通配符部分

来自分类Dev

如何从Sky Drive获取文件名并显示在列表中

Related 相关文章

  1. 1

    如何从Javascript FileReader获取文件名?

  2. 2

    如何从标准输入中获取文件名

  3. 3

    角度:FileReader-从列表中获取文件名

  4. 4

    从FileReader对象获取文件名

  5. 5

    如何使用jQuery从输入类型文件中获取选定的文件名和文件路径

  6. 6

    如何遍历文件夹并将文件名输入到函数中

  7. 7

    我如何从dos asm中的用户输入中获取文件名

  8. 8

    我如何从dos asm中的用户输入中获取文件名

  9. 9

    如何在继承的文件的装饰器函数中获取python文件名

  10. 10

    如何使用 glob() 函数获取上传的文件名?

  11. 11

    如何在ffmpeg的输出文件名中包含输入文件名

  12. 12

    如何在Perl中从文件名获取文件句柄?

  13. 13

    如何从Android中的文件路径获取文件名

  14. 14

    如何从文件字段中获取文件名?

  15. 15

    如何使用PowerShell中的文件内容获取文件名

  16. 16

    Golang如何在Go中读取输入文件名

  17. 17

    如何从图库中挑选的图像中获取文件名?

  18. 18

    hadoop map reduce程序中如何在映射器代码中获取输入文件名

  19. 19

    从图像路径(从函数)获取文件名

  20. 20

    如何基于JavaScript中的事件对象获取文件名?

  21. 21

    如何获取目录中的所有文件名?

  22. 22

    如何在python中获取Windows短文件名?

  23. 23

    如何从inotifywait事件中获取文件名?

  24. 24

    如何在Mocha Reporter中获取测试文件名

  25. 25

    如何使用Java在Windows中获取短文件名?

  26. 26

    如何在Django中获取上传的文件名

  27. 27

    如何从PHP请求中获取引用文件名

  28. 28

    如何在Bash中获取文件名的通配符部分

  29. 29

    如何从Sky Drive获取文件名并显示在列表中

热门标签

归档