var maxsize = 6*1024*1024;//6M
var errMsg = "上传的附件文件不能超过6M!!!";
var tipMsg = "您的浏览器暂不支持计算上传文件的大小,确保上传文件不要超过6M,建议使用IE、FireFox、Chrome浏览器。";
var browserCfg = {};
var ua = window.navigator.userAgent;
if (ua.indexOf("MSIE")>=1){
browserCfg.ie = true;
}else if(ua.indexOf("Firefox")>=1){
browserCfg.firefox = true;
}else if(ua.indexOf("Chrome")>=1){
browserCfg.chrome = true;
}

function checkfile(){
try{
var obj_file = document.getElementById("instructionName");
if(obj_file.value==""){
alert("请选择上传文件");
return;
}
if(!/\.(doc|xls|pdf|xlsx|pptx|docx|ppt)$/.test(obj_file)){
alert("上传文件只能是doc|xls|pdf|xlsx|pptx|docx|ppt为后缀文件");
$("#instructionName").val('');
return;
}
var filesize = 0;
if(browserCfg.firefox || browserCfg.chrome ){
filesize = obj_file.files[0].size;
}else if(browserCfg.ie){
var obj_img = document.getElementById('tempimg');
obj_img.dynsrc=obj_file.value;
filesize = obj_img.fileSize;
}else{
alert(tipMsg);
$("#instructionName").val('');
return;
}
if(filesize==-1){
alert(tipMsg);
return;
}else if(filesize>maxsize){
alert(errMsg);
return;
}else{
document.getElementById("bigsmall").value=filesize;
return;
}
}catch(e){
alert(e);
}
}

<input id="instructionName" type="file" name="instructionName" value="" onchange="checkfile()" style="width:80"/>

<input type="hidden" id="bigsmall" name="bigsmall" value="" />

js限制上传文件的类型和大小的更多相关文章

  1. js判断上传文件的类型和大小

    //检测文件大小和类型 function fileChange(target){ //检测上传文件的类型 if(!(/(?:jpg|gif|png|jpeg)$/i.test(target.value ...

  2. [JS] 限制上传文件的类型和大小

    <!DOCTYPE html> <!-- saved from url=(0035)http://localhost:9090/qraved/update --> <ht ...

  3. js限制上传文件类型和大小

    <html> <head> <script type="text/javascript"> function fileChange(target ...

  4. Atitit.js获取上传文件全路径

    Atitit.js获取上传文件全路径 1. 默认的value只能获取文件名..安全原因.. 1 2. Firefox浏览器的读取 1 3. Html5 的file api 2 4. 解决方法::使用a ...

  5. js能否上传文件夹

    文件夹上传:从前端到后端 文件上传是 Web 开发肯定会碰到的问题,而文件夹上传则更加难缠.网上关于文件夹上传的资料多集中在前端,缺少对于后端的关注,然后讲某个后端框架文件上传的文章又不会涉及文件夹. ...

  6. 利用ajaxfileupload.js异步上传文件

    1.引入ajaxfileupload.js 2.html代码 <input type="file" id="enclosure" name="e ...

  7. js获取上传文件内容(未完待续)

    js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...

  8. js获取上传文件内容

    js 获取上传文件的字节数及内容 <div> 上传文件 : <input type="file" name = "file" id = &qu ...

  9. MIME类型-服务端验证上传文件的类型

    MIME的作用 : 使客户端软件,区分不同种类的数据,例如web浏览器就是通过MIME类型来判断文件是GIF图片,还是可打印的PostScript文件. web服务器使用MIME来说明发送数据的种类, ...

随机推荐

  1. 使用SimpleXML 解析xml

    最近搞解析XML搞的我是水深火热的,所以打算对PHP5解析XML做个学习小结.今天介绍下与PHP5捆绑在一起的SimpleXML扩展,这个用于可读写XML的新的API,让解析XML不再繁琐和困难,用起 ...

  2. ABAP-增强-层级BOM-AB件业务

    目前新需求:整车A下挂有委外总成件B,总成件B和子件E是层级BOM,且采购类型均为F,信息记录类型均为寄售,按照现在标准MRP逻辑,只能计算第一层级子件需求,无法运行出子件E的需求. 1.实现方式 1 ...

  3. Mybatis知识(1)

    1.#{}和${}的区别是什么? #{}是预编译处理,${}是字符串替换. Mybatis在处理#{}时,会将sql中的#{}替换为?号,调用PreparedStatement的set方法来赋值: M ...

  4. js 删除节点,jquery遍历通过内容定位节点

    $(".class1 .class2").each(function (index, item) { var gettedValue = $(item).find(".c ...

  5. R及Rstuio下载及配置,及基本使用介绍

    1.R和Rstudio下载地址 https://cran.rstudio.com/a 2.Rstudio 的配置 外观.代码显示比例配置 选中tools 选中globle options 选中appe ...

  6. Hbase—学习笔记(一)

    此文的目的: 1.重点理解Hbase的整体工作机制 2.熟悉编程api,能够用来写程序 1.  什么是HBASE 1.1.   概念特性 HBASE是一个数据库----可以提供数据的实时随机读写 HB ...

  7. java 里定义的方法参数 (final String... args)

    定义成final是为了防止在方法类里面修改参数,final String... args 为JDK新的特性,为可变长参数.编译的时候被解释为:public DCMException(final Str ...

  8. 关于number...的精度问题

    一 当数字的精度被定为number(3,2)时, 这时他能输入的数字整数部分只能是3-2=1位, 小数位如果不够会用0补齐, 超出的四舍五入保留3位小数. SQL> insert into t_ ...

  9. 10.9zuoye

    public class fulei { public fulei() { System.out.println("欢迎使用海尔"); } public String Pinpai ...

  10. 信息: The APR based Apache Tomcat Native library which allows optimal performance in production environments was not found on the java.library.path:

    问题信息详细: 信息: The APR based Apache Tomcat Native library which allows optimal performance in productio ...