Javascript 我删除了我上传的一个文件，我得到了一个错误

当我删除我上传的文件时，我得到了一个错误。这是

js:42未捕获类型错误：无法读取null的属性'removeChild'。对于IE，我必须使用
removeChild
和
var
。有没有好的方法来修复错误


html


上传档案
去除
提交


js

（函数（）{
var formElement=document.querySelector（“.page_form”）；
var fileChooserEl=formElement.querySelector（'.upload_标签输入[type=“file”]”）；
var uploadDocumentsWrap=formElement.querySelector（“.upload\u documents\u wrap”）；
var uploadDocuments=uploadDocumentsWrap.querySelector（“.upload_documents”）；
var templateItemParent=document.querySelector（“上传文件”）；
var templateItem=templateItemParent.querySelector（“.upload_file”）；
var uploadFiles=[]；
var myFileList=[]；
变量onFileChooserChange=函数（）{
对于（var i=0；i=1024&&size<1024000）{
后缀=“KB”；
大小=数学圆（大小/1024*100）/100；
}否则，如果（尺寸>=1024000）{
后缀=“MB”；
尺寸=数学圆（尺寸/1024000*100）/100；
}
uploadFileSize.textContent=大小+后缀；
uploadFileRemove.addEventListener（“单击”），函数（evt）{
evt.preventDefault（）；
myFileList=myFileList.filter（函数（项）{
return item.name.toLowerCase（）！==uploadFileRemove.previousElementSibling.textContent；
});
log（myFileList）；
var index=uploadFiles.indexOf（evt.target.parentNode）；
uploadFileRemove.parentNode.parentNode.removeChild（uploadFileRemove.parentNode）；
uploadFiles.splice（索引，1）；
拼接（索引，1）；
控制台日志（索引）；
如果（！uploadFiles.length）{
UploadDocumentsRap.classList.add（“视觉隐藏”）；
}
});
上传文档。追加子项（位置）；
上传文件。推送（位置）；
myFileList.push（fileChooserEl.files[i]）；
}
fileChooserEl.value=“”；
};
log（上传文件）；
var getFormData=函数（）{
var数据=新的FormData（formElement）；
对于（变量i=0；i
错误在这一行：

uploadFileRemove.parentNode.parentNode.removeChild(uploadFileRemove.parentNode);

我调试了代码，发现每次单击“删除”按钮时都删除了错误的文件。使用
索引
更容易、更清楚地识别要删除的文件。我这样编辑代码，效果很好：

...
var index = uploadFiles.indexOf(evt.target.parentNode);
//edit
var removefile = document.querySelectorAll(".upload_info")[index];
uploadDocuments.removeChild(removefile);                      
//uploadFileRemove.parentNode.parentNode.removeChild(uploadFileRemove.parentNode);
uploadFiles.splice(index, 1);
myFileList.splice(index, 1);
console.log(index);
...

结果:

您的代码在IE中可以工作吗？我做了一个测试，但它不能在IE中工作，因为
for…of
。它显示
SCRIPT1004:应为“；”在IE 11中。您需要使用来传输代码。问题中的错误显示在Chrome中。那么你想处理Chrome中的错误吗？@YuZhou是的。我想修复Chrome中的错误。我在IE中使用babel polyfill。如果我在IE中遇到新的错误，我想这是在Chrome中修复后的下一步。@YuZhou我修复了你在IE中写的
的错误。但我仍然无法修复Chrome中的错误，即
js:42未捕获类型错误：无法读取null的属性'removeChild'。你知道怎么做吗。
uploadFileRemove.parentNode.parentNode.removeChild(uploadFileRemove.parentNode);

...
var index = uploadFiles.indexOf(evt.target.parentNode);
//edit
var removefile = document.querySelectorAll(".upload_info")[index];
uploadDocuments.removeChild(removefile);                      
//uploadFileRemove.parentNode.parentNode.removeChild(uploadFileRemove.parentNode);
uploadFiles.splice(index, 1);
myFileList.splice(index, 1);
console.log(index);
...