input上传文件个数控制

HTML:

1     <h3>请上传[2,5]个文件</h3>
2     <form action="" enctype="multipart/form-data">
3         <input type="file" name="file" multiple="multiple" id="file" onchange="fileCountCheck(this,2,5)" />
4     </form>

JavaScript:

 1     /**
 2      * [fileCountCheck 上传文件数量检测]
 3      * @param  {[Object]} filesObj [文件对象]
 4      * @param  {[Number]} minFileNum  [文件数量下限]
 5      * @param  {[Number]} maxFileNum  [文件数量上限]
 6      * @return {[Boolean]}          [真假]
 7      */
 8     function fileCountCheck(filesObj, minFileNum, maxFileNum) {
 9 
10         // console.log(filesObj.files); // 文件对象
11 
12         if (window.File && window.FileList) {
13 
14             var fileCount = filesObj.files.length;
15 
16             if (fileCount < minFileNum || fileCount > maxFileNum) {
17 
18                 // 不符合数量的处理
19                 window.alert('文件数不能小于' + minFileNum + '个,也不能超过' + maxFileNum + '个,你选择了' + fileCount + '个');
20 
21                 return false;
22 
23             } else {
24 
25                 // 符合数量的处理
26                 window.alert('符合规定');
27 
28                 return true;
29 
30             }
31 
32         } else {
33 
34             // 不支持FileAPI
35             window.alert('抱歉,你的浏览器不支持FileAPI,请升级浏览器!');
36 
37             return false;
38 
39         }
40 
41     }

除此之外,还能控制文件的大小或是文件格式等。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏哲学驱动设计

CTO 能力模型 V0.1

最近思考了很多,我在大贲这几年的工作内容。从一开始到现在,伴随着大贲从一二十人,走到了现在的两百多人。我的工作也从一开始的带头冲锋陷阵,逐步转移到了带领产品研发...

27620
来自专栏Petrichor的专栏

requirements.txt 介绍 & 快捷生成

  requirements.txt 文件 里面记录了当前程序的所有依赖包及其精确版本号。

16010
来自专栏Petrichor的专栏

OJ术语: AC、WA、TLE、OLE、MLE、RE、PE、CE

51610
来自专栏黑白安全

百度知道隐藏信息查询

可以看到查询账号的百度知道的所有回复。 百度不收录百度知道答主的部份回复,而且删除过了的提问,还是能看到回复。

12010
来自专栏Petrichor的专栏

深度学习: 从 anchor 进化到 proposal

55540
来自专栏Petrichor的专栏

shutdown & reboot & last

23630
来自专栏AI科技大本营的专栏

阿里从来不只属于马云,马云永远属于阿里

9 月 10 日教师节,阿里巴巴集团创始人马云发出题为“教师节快乐”的公开信宣布:一年后的阿里巴巴 20 周年之际,即 2019 年 9 月 10 日,他将不再...

9420
来自专栏逆向技术

win32程序之窗口程序,以及消息机制

  通过上一讲.我们了解了窗口其实是绘制出来的.而且是不断绘制的过程. 所以窗口的本质是绘制. 但是我们现在看到的窗口程序.都可以点击关闭按钮. 使用鼠标点击会...

14230
来自专栏黑白安全

星号(*)密码查看

24640
来自专栏Petrichor的专栏

主机:各线介绍 & 问题速查表

  在独立组装过八九台主机,遇坑无数后,我写下了《如何自己组装电脑(从配件到整机)来省下一大笔钱》以及《组装台式机遇坑总结》这两篇技术博客。

11910

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励