我有一个带有multiple="multiple"属性的文件输入,允许用户一次选择多个文件.我想在上传之前显示所选的文件名及其计数但是我不知道如何使用javascript从文件输入元素获取此信息?
<input type="file" id="fileElementId" name="files[]" size="20" multiple="multiple" />
Run Code Online (Sandbox Code Playgroud)
我试过这个:
document.getElementById('fileElementId').value
Run Code Online (Sandbox Code Playgroud)
但是,当我选择多个文件时,这只返回一个文件名.使用JavaScript是如何从具有multiple属性的文件输入元素中检索所选文件及其名称的数量?
HTML是:
<input type="file" multiple="multiple" name="upload" id="id_upload" />
Run Code Online (Sandbox Code Playgroud)
如果我加载三个文件,document.getElementById("id_upload").value只返回单个文件名而不是三个名称的数组或逗号分隔的三个名称的字符串.与jQuery val()相同的故事.有没有办法获得整个列表?
我在jQuery中完成了这个,从输入文件标签中获取文件名,使用jQuery它可以很好地工作.
//jQuery('input[type=file]').on('change', prepareUpload);
document.getElementsByTagName('input[type=file]').addEventListener('change',prepareUpload1,true);
/*
//this works in jQuery
function prepareUpload(event)
{
var files = event.target.files;
var fileName = files [0].name
alert(fileName);
}
*/
/****Check it here ****/
// it does not work in javascript
function prepareUpload1(event)
{
var files = event.target.files;
var fileName = files [0].name
alert("fileName 2 : "+fileName);
}Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" />Run Code Online (Sandbox Code Playgroud)
但我发现Event.target在IE中不起作用,我试图将其改为java脚本addeventlistener,它没有用.
它抛出错误
Uncaught ReferenceError: input is not defined
Run Code Online (Sandbox Code Playgroud)
它在jQuery中工作,但它在JS中不起作用,由于IE问题,我需要将其更改为JS.
有人可以提供帮助