客户端js判断文件类型和文件大小即限制上传大小

最新推荐文章于 2022-09-19 17:53:43 发布

zhangyubababa

最新推荐文章于 2022-09-19 17:53:43 发布

阅读量355

点赞数

分类专栏： react

原文链接：https://www.jb51.net/article/43498.htm

版权

react 专栏收录该内容

89 篇文章 1 订阅

订阅专栏


```css
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <input type="file" name="contractFileName" style="width: 500px;" onchange="fileChange(this);" />

    <script type="text/javascript">
    const {log}=console
        var isIE = /msie/i.test(navigator.userAgent) && !window.opera;

        function fileChange(target, id) {
            log(target.files)
            log(target)
            var fileSize = 0;
            var filetypes = [".jpg", ".png", ".rar", ".txt", ".zip", ".doc", ".ppt", ".xls", ".pdf", ".docx", ".xlsx"];
            var filepath = target.value;
            var filemaxsize = 1024 * 2; //2M 
            if (filepath) {
                var isnext = false;
                var fileend = filepath.substring(filepath.indexOf("."));
                // log(fileend)
                if (filetypes && filetypes.length > 0) {
                    for (var i = 0; i < filetypes.length; i++) {
                        if (filetypes[i] == fileend) {
                            isnext = true;
                            break;
                        }
                    }
                }
                if (!isnext) {
                    alert("不接受此文件类型！");
                    target.value = "";
                    return false;
                }
            } else {
                return false;
            }
            if (isIE && !target.files) {
                var filePath = target.value;
                var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
                if (!fileSystem.FileExists(filePath)) {
                    alert("附件不存在，请重新输入！");
                    return false;
                }
                var file = fileSystem.GetFile(filePath);
                fileSize = file.Size;
            } else {
                fileSize = target.files[0].size;
            }

            var size = fileSize / 1024;
            if (size > filemaxsize) {
                alert("附件大小不能大于" + filemaxsize / 1024 + "M！");
                target.value = "";
                return false;
            }
            if (size <= 0) {
                alert("附件大小不能为0M！");
                target.value = "";
                return false;
            }
        }
    </script>

</body>

</html>

转载：
https://www.jb51.net/article/43498.htm

zhangyubababa

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
客户端js判断文件类型和文件大小即限制上传大小

```css<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit.
复制链接

扫一扫

专栏目录