JS实战应用之 JS控制FileUpload控件上传的文件类型和清空控件选中的文件

转载于 2013-08-20 21:54:00 发布 · 206 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/dotnet-libo/p/3271492.html

文章标签：

#javascript #ViewUI

本文介绍了一种使用JavaScript实现的图片上传验证脚本，该脚本可以限制用户仅能上传特定类型的图片文件（如.gif、.jpg、.jpeg、.png、.bmp），并提供了示例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script type="text/javascript">
            function CheckFile() {
                var sender = event.srcElement;
                var array = new Array('gif', 'jpg', 'jpeg', 'png', 'bmp');  //可以上传的文件类型
                if (sender.value == '') {
                    alert("请选择要上传的图片!");
                    return false;
                }
                else {
                    var fileContentType = sender.value.match(/^(.*)(\.)(.{1,8})$/)[3]; //这个文件类型正则很有用
                    var isExists = false;
                    for (var i in array) {
                        if (fileContentType.toLowerCase() == array[i].toLowerCase()) {
                            isExists = true;
                            return true;
                        }
                    }
                    if (isExists == false) {
                        alert("上传图片类型不正确!");
                        var html = document.getElementById('uploadSpan').innerHTML;
                        function resetFile() {
                            document.getElementById('uploadSpan').innerHTML = html;
                        }
                        resetFile(); //清空FileUpload控件值
                        return false;
                    }
                    return false;
                }
            }
        </script>
        <span id="uploadSpan">
            <asp:FileUpload ID="upload" runat="server" onchange="CheckFile();" />
        </span>