顯示所有選定的文件

我有一個輸入字段，允許我選擇多個文件（圖片在我的情況），問題是，當我選擇多個文件時，它只會在谷歌瀏覽器中顯示一個文件。但是，它在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

顯示所有選定的文件

回答

相關問題