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


Posted in Javascript onNovember 20, 2013

由于项目需要!需要脚本在客户端判断大小和文件类型!自己网上找资料找的好辛苦!索性自己写了一个并测试 文件上传大小限制的一个例子,兼容ie6,ie7,ie8 ,Google Chrome,ff等浏览器

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script type="text/javascript"> 
var isIE = /msie/i.test(navigator.userAgent) && !window.opera; 
function fileChange(target,id) { 
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(".")); 
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> 
</head> 
<body> 
<input type="file" name="contractFileName" style="width: 500px;" onchange="fileChange(this);"/> 
</body> 
</html>
Javascript 相关文章推荐
jQuery 源码分析笔记(4) Ready函数
Jun 02 Javascript
JavaScript DOM 编程艺术(第2版)读书笔记(JavaScript的最佳实践)
Oct 01 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
Dec 27 Javascript
以JSON形式将JS中Array对象数组传至后台的方法
Jan 06 Javascript
原生javascript实现的一个简单动画效果
Mar 30 Javascript
Jquery on绑定的事件 触发多次实例代码
Dec 08 Javascript
关于JS Lodop打印插件打印Bootstrap样式错乱问题的解决方案
Dec 23 Javascript
微信小程序 密码输入(源码下载)
Jun 27 Javascript
Angular4学习教程之HTML属性绑定的方法
Jan 04 Javascript
灵活使用console让js调试更简单的方法步骤
Apr 23 Javascript
vue实现歌手列表字母排序下拉滚动条侧栏排序实时更新
May 14 Javascript
Vue发布项目实例讲解
Jul 17 Javascript
JS保留两位小数 四舍五入函数的小例子
Nov 20 #Javascript
使用js简单实现了tree树菜单
Nov 20 #Javascript
js 用CreateElement动态创建标签示例
Nov 20 #Javascript
JS实现字体选色板实例代码
Nov 20 #Javascript
jquery实现树形二级菜单实例代码
Nov 20 #Javascript
javascript右下角弹层及自动隐藏(自己编写)
Nov 20 #Javascript
jQuery 快速结束当前正在执行的动画
Nov 20 #Javascript
You might like
玛琪朵 Macchiato
2021/03/03 咖啡文化
php去除字符串中空字符的常用方法小结
2015/03/17 PHP
PHP实现在线阅读PDF文件的方法
2015/06/17 PHP
PHP实现将base64编码字符串转换成图片示例
2018/06/22 PHP
JavaScript基本概念初级讲解论坛贴的学习记录
2009/02/22 Javascript
JS 两日期相减,获得天数的小例子(兼容IE,FF)
2013/07/01 Javascript
jQuery遍历json中多个map的方法
2015/02/12 Javascript
微信小程序 页面之间传参实例详解
2017/01/13 Javascript
jQuery实现给input绑定回车事件的方法
2017/02/09 Javascript
VsCode插件整理(小结)
2017/09/14 Javascript
Vue组件全局注册实现警告框的实例详解
2018/06/11 Javascript
JS实现十分钟倒计时代码实例
2018/10/18 Javascript
js实现上传按钮并显示缩略图小轮子
2020/05/04 Javascript
微信小程序以7天为周期连续签到7天功能效果的示例代码
2020/08/20 Javascript
python先序遍历二叉树问题
2017/11/10 Python
浅谈python日志的配置文件路径问题
2018/04/28 Python
python 实现图片旋转 上下左右 180度旋转的示例
2019/01/24 Python
python通用读取vcf文件的类(复制粘贴即可用)
2020/02/29 Python
解决启动django,浏览器显示“服务器拒绝访问”的问题
2020/05/13 Python
Django QuerySet查询集原理及代码实例
2020/06/13 Python
Mio Skincare美国官网:身体紧致及孕期身体护理
2017/03/05 全球购物
澳大利亚在线家具、灯饰和家居装饰店:LivingStyles
2018/11/20 全球购物
Dogeared官网:在美国手工制作的珠宝
2019/08/24 全球购物
公司业务主管岗位职责
2013/12/07 职场文书
办理退休介绍信
2014/01/09 职场文书
《草虫的村落》教学反思
2014/02/16 职场文书
初三学生个人自我评定
2014/04/06 职场文书
协议书的格式
2014/04/23 职场文书
优秀少先队工作者事迹材料
2014/05/13 职场文书
公司新人试用期自我评价
2014/09/17 职场文书
终止劳动合同协议书
2014/10/05 职场文书
2015年教师党员自我评价材料
2015/03/04 职场文书
个人简历求职信范文
2015/03/20 职场文书
不同意离婚上诉状
2015/05/23 职场文书
《追风筝的人》:人心中的成见是座大山,但请不忘初心
2019/11/15 职场文书
彻底理解golang中什么是nil
2021/04/29 Golang