如何使用 JavaScript 停止文件上传事件答案

【问题标题】：How stop file upload event using JavaScript如何使用 JavaScript 停止文件上传事件
【发布时间】：2016-01-07 11:31:59
【问题描述】：

当我上传的文件超过 5mb 或者我的文件扩展名不是 .jpg 或 .png 时，我想停止文件上传事件。我找到了一个代码，但是当我尝试上传无效的文件类型时，它只会提醒我我上传了错误的文件，但它不会取消事件。代码如下：

<script>
function checkFile(fieldObj)
{
    var FileName  = fieldObj.value;
    var FileExt = FileName.substr(FileName.lastIndexOf('.')+1);
    var FileSize = fieldObj.files[0].size;
    var FileSizeMB = (FileSize/5485760).toFixed(2);

    if ( (FileExt != "png" && FileExt != "jpg") || FileSize>5485760)
    {
        var error = "File type : "+ FileExt+"\n\n";
        error += "Size: " + FileSizeMB + " MB \n\n";
        error += "Please make sure your file is in png or jpg format and less than 5 MB.\n\n";
        
        alert(error);
        return false;
    }
    return true;
}
</script>

这里是html代码：

 <input type="file"onchange="checkFile(this)"name='sec_2_img'>

【问题讨论】：

标签： javascript html dom-events

【解决方案1】：

您需要清除“sec_2_img”的值。为此，您可以在 alert(error) 之后和 return false; 之前添加 fieldObj.value = "";。这将从sec_2_img 中删除文件名并强制用户选择一个新文件名，同时仍显示消息以便用户知道该做什么。

【讨论】：

【解决方案2】：

1.) 不要使用警报，它们很烦人，而且浏览器会很快阻止它们，因此您的用户将不会再收到任何消息。使用模式窗口或在表单的某处添加带有错误消息的样式元素。

2.) 如果你需要一个有效的文件来提交这个表单，你必须在表单的提交事件中添加一个事件处理程序并停止传输。

3.) 您对文件扩展名的检查区分大小写，这可能会给您在 Windows 上带来问题，并且您对文件大小的计算是错误的。

【讨论】：