JavaScript对上传的文件进行大小和格式的校验
1.页面代码:
<form id="uploadFileform" action="$!{request.contextPath}/user/uploadImage" method="post" enctype="multipart/form-data" > <center> <label id="Header" cssClass="HeaderText" value="图片上传" /> <hr style="size: 1" /> <p id="FileList"> <input id="uploadImage" value="" type="file" name="uploadImage" size="50" /> </p> <hr style="size: 1" /> <p>温馨提示:只允许上传.jpg .gif .png 后缀的图片</p> <p style="color:green;">(请务必上传真实证件照片或图片 否则不会通过认证)</p> <p> <input class="btn btn-primary" type="button" value="上传图片" onclick="uploadImages();"/> </p> <hr style="size: 1" /> </center> <p align="center"> <span class="GbText" style="width: 100%; color: red;"></span> </p> </form>
2.Js代码:
function uploadImages() { var str = $("#uploadImage").val(); if(str.length!=0){ var reg = ".*\\.(jpg|png|gif|JPG|PNG|GIF)"; var r = str.match(reg); if(r == null){ alert("对不起,您的图片格式不正确,请重新上传"); } else { if(window.ActiveXObject) { var image=new Image(); image.dynsrc=str; if(image.fileSize>5243000){ alert("上传的图片大小不能超过5M,请重新上传"); return false; } } else{ var size = document.getElementById("uploadImage").files[0].size; if(size>5243000) { alert("上传的图片大小不能超过5M,请重新上传"); return false; } } $('#uploadFileform').submit(); } } else { alert("请先上传图片"); } }
相关推荐
本篇介绍一个前端JS便捷判断上传文件大小的方法。 这个是比较好的 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> [removed] var isIE = /msie/i.test...
JavaScript 上传文件限制参数案例详解 项目场景: 1,上传文件限制 功能作用: 1,防止前端操作上传异常文件 2,限制符合的规则,优化展示模型 功能实现: 1,获取file实例 2,执行校验规则方法 代码如下:...
JS上传文件大小验证 自己写的方法,不是完整控件。 可以拿去借鉴。
现在HttpUploader4在对GB级文件进行MD5校验时速度提高了4倍。同时CPU占用率更低。 HttpUploader4更加注重对硬盘的保护,在HttpUploader4中不再直接对文件进行I/O操作,而是在内存中对文件进行操作,所以不仅极大的...
现在HttpUploader4在对GB级文件进行MD5校验时速度提高了4倍。同时CPU占用率更低。 HttpUploader4更加注重对硬盘的保护,在HttpUploader4中不再直接对文件进行I/O操作,而是在内存中对文件进行操作,所以不仅极大的...
因为需要把文件先上传到服务器上,如果文件很大的话,在加上网不是很快,需要等待好长时间,治标不治本。 功能解析: 在这里我只介绍IE与FireFox两个浏览器的不同做法。 IE6: 关键字: fileSize ...
现在HttpUploader4在对GB级文件进行MD5校验时速度提高了4倍。同时CPU占用率更低。 HttpUploader4更加注重对硬盘的保护,在HttpUploader4中不再直接对文件进行I/O操作,而是在内存中对文件进行操作,所以不仅极大的...
现在HttpUploader4在对GB级文件进行MD5校验时速度提高了4倍。同时CPU占用率更低。 HttpUploader4更加注重对硬盘的保护,在HttpUploader4中不再直接对文件进行I/O操作,而是在内存中对文件进行操作,所以不仅极大的...
第9章 大小、定位、轮廓相关属性 250 9.1 width、height相关属性 251 9.2 定位相关属性 255 9.3 轮廓相关属性 257 9.4 用户界面和滤镜属性 258 9.5 本章小结 263 第10章 盒模型与布局相关属性 264 10.1 盒...
jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 Druid(数据源配置 sql防注入 sql性能监控) 统一的异常处理 JSP ...
开始使用当前MASTER为1.1.4-SNAPSHOT版本如果使用 SNAPSHOT 版本 , 请勾选 develop-...#单个文件上传大小限制spring: servlet: multipart: max-file-size: 5000MB#fastdfs客户端配置fdfs: connect-timeout: 1601 thumb-
jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件 类型、大小、数量进行控制;利用searchbox实现查找功能 Druid(数据源配置 sql防注入 sql性能监控) 统一的异常处理 JSP JSTL ...
添加了shiro session过期的登录跳转 - jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 - [Druid(数据源配置 sql防注入 sql...
添加了shiro session过期的登录跳转 - jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 - [Druid(数据源配置 sql防注入 sql...
- jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 - [Druid(数据源配置 sql防注入 sql性能监控)]...
- jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 - [Druid(数据源配置 sql防注入 sql性能监控)] - 统一的异常处理 - JSP ...
jQuery EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 Druid(数据源配置 sql防注入 sql性能监控) 统一的异常处理 JSP JSTL ...
PESMCS Ticket(下称PT)是一款基于GPLv2协议发布的开源客服工单系统。除了传统的站内工单提交模式,我们以全新的设计理念,基于Javascript语言...优化上传功能,添加上传大小限制的修改。 添加工单模型字段选项的校验。
EasyUI开发前端页面,利用jQuery文件上传插件实现拖拽上传的效果并对文件类型、大小、数量进行控制;利用search-box实现查找功能 统一的异常处理 JSP JSTL JavaScript kindeditor富文本编辑器,处理图片上传和