显示所有选定的文件

我有一个输入字段，允许我选择多个文件（图片在我的情况），问题是，当我选择多个文件时，它只会在谷歌浏览器中显示一个文件。但是，它在IE上运行得很好，所以不确定问题来自哪里。任何想法？显示所有选定的文件

<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" enctype="multipart/form-data"> 
    <label class="btn btn-primary" for="my-file-selector"> 
    <input id="my-file-selector" type="file" name="files[]" style="display:none;" multiple onchange="$('#upload-file-info').html($(this).val());">Browse</label> 
    <span class='label label-info' id="upload-file-info"></span> 
    <div style="float:right;"> 
     <label class="btn btn-primary" for="my-file-selector2"> 
     <input id="my-file-selector2" type="Submit" style="display:none;" name="search">Import</label> 
    </div> 
</form>

来源

2016-11-15 Bobby

我唯一可以_think_ off的原因是chrome不是版本6.0+，因为这是在启动对多属性的支持时。我很好奇的原因。 – Roy123

看到我的回答，你使用'$（this）.val（）;'来显示文件，但是你需要使用'prop（'files'）'并且循环每个文件。 – Timmetje

这与您的浏览器无关。

$(this).prop('files');确实包含所有上传的文件作为一个文件列表对象。

循环的文件属性，并把所有的名称在浏览器的规格有关文件的#upload-file-info

$('#my-file-selector').on('change', function(e){ 
 
    $('#upload-file-info').html(""); //clear the info before appending 
 
    var files = $(this).prop('files'); 
 
    for (var i = 0; i < files.length; i++) { 
 
    \t $('#upload-file-info').append(files[i].name); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="" method="post" enctype="multipart/form-data"> 
 
    <label class="btn btn-primary" for="my-file-selector"> 
 
    <input id="my-file-selector" type="file" name="files[]" style="display:none;" multiple>Browse</label> 
 
    <span class='label label-info' id="upload-file-info"></span> 
 
    <div style="float:right;"> 
 
     <label class="btn btn-primary" for="my-file-selector2"> 
 
     <input id="my-file-selector2" type="Submit" style="display:none;" name="search">Import</label> 
 
    </div> 
 
</form>

来源

2016-11-15 15:22:59 Timmetje

谢谢！完美工作 – Bobby

没问题;）仅供参考'multiple'属性只能从IE10正常工作 – Timmetje

-3

尝试在浏览器选择中使用放大器规范

来源

2016-11-15 15:24:17 aml

显示所有选定的文件

回答

相关问题