当从一个特定的输入中选择文件时,我尝试将html元素(特别是文件输入元素)注入到父div中。当此输入选择一个文件时,它应该将该文件传递给我正在创建的input元素。
主输入选择文件:
var file = document.getElementById("file");
file.onchange = function(){
var ext = this.value.match(/\.([^\.]+)$/);
if(ext!=null && ext.length>1){
switch (ext[1].toLowerCase()) {
case 'doc':
...
if (file.files.length > 0) {
appendFile(file.files);
}
break;
default:
alert('Sorry, files of type .' + ext[1].toLowerCase() + " are not allowed.");
this.value = '';
}
}
};
如果存在文件onchange,则将该文件传递到appendFile
function appendFile(files){
...
if(files.length>0){
file = files[0];
...
htmlFile.appendChild(createFileInput(files));
...
parentDiv.append(htmlFile);
}
}
执行额外的检查以确保文件存在,生成其他htmlElements并将文件传递给createFileInput函数以创建输入标记
function createFileInput(files){
fileInput = document.createElement("input");
fileInput.setAttribute('type','file');
fileInput.files=files;
fileInput.classList.add('files');
fileInput.style.display = 'none';
return fileInput;
}
创建一个file类型的输入标记,并将输入中的文件设置为等于传递到函数中的文件。
这在Chrome中非常适合我。它在IE中不能正常工作,但我非常确定我已经在createFileInput()
方法中跟踪到了fileInput.files=files;
行的错误。
由于某些原因,这些隐藏输入的文件字段无法在IE中设置。有没有人知道为什么会这样,或者知道另一种设置输入文件字段的方法?
https://stackoverflow.com/questions/56158824
复制相似问题