javascript - html5输入类型文件浏览器差异

标签 javascript html file input

我在使用 Firefox 和 IE11 时遇到了一个看起来很奇怪的问题。 我想使用 input type=file 来获取 fileList,它在 chrome 和 Safari 中有效,该值返回文件名,但在 FireFox 和 IE 中 fileList 为空

这是 html,只需将其放入文件中并用浏览器打开,或者将其放在网站上并加载页面即可。

<html>
<head>
<title>input file test</title>
<script>
function file1_click(){
"use strict";    
var f = document.getElementById('file1');
alert('value=' + f.value + '\nfiles=' + JSON.stringify(f.files) );
}   
</script>
</head>
<body>
<form id="form1">
<input type="file" id="file1" onchange="file1_click();" /> 
</form>
</body>
</html>

最佳答案

f.files 是一个对象。您可以循环浏览它。

function file1_click(){
    "use strict";    
    var f = document.getElementById('file1');
    var filesArray = [];
    for(var i=0, len=f.files.length; i<len; i++) {
        filesArray.push(f.files[i]['name'])
    }
    alert('value=' + f.value + '\nfiles=' + JSON.stringify(filesArray) );
}

此外,如果您想要多个图像,则需要在文件输入上指定“multiple”属性。

<input type="file" id="file1" onchange="file1_click();" multiple />

关于javascript - html5输入类型文件浏览器差异,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27169780/

相关文章:

javascript - HTML/CSS/JS切换不同谷歌日历是同一个框架

python - 如何从 Python 中的像素值列表创建 PNG 图像文件?

c++ - 从同一文件构造基类和继承类

javascript - Jquery/Javascript

javascript - IE8正在将表单提交到当前页面

javascript - 如何从控制台修改 Vue.js 输入元素值

javascript - javascript目标心率计算器所需的计算帮助

javascript - 带有时间的 html/javascript onclick 函数

html - 如何删除两个 <span> 标签之间的空格?

javascript - 输入类型 ="file"样式帮助