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

How stop file upload event using JavaScript

本文关键字:事件 文件 何使用 JavaScript      更新时间:2023-09-26

当我上传的文件超过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'>

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

1.)不要使用警报,它们很烦人,浏览器会很快阻止它们,所以你的用户不会再收到任何消息。使用模式窗口或在表单的某个位置添加带有错误消息的样式元素。

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

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