<input id="File1" type="file" onchange="checkFile(this)" />

方式一)

function checkFile(o) {
var fileobj = o.files[0];
if ( typeof(fileobj) == "undefined"){
alert("请选择要上传的文件。");
return false;
}
else {
var fileType = fileobj.type;
var fileName = fileobj.name;
var fileSize = fileobj.size / 1024 / 1024;
var maxSize = 2048;

         var allowType = /^(image\/jpeg|image\/png)$/i; // 检查图片格式
         if (!allowType.test(fileType)) {
            alert("文件格式必须为jpeg或png");
            return false;
         }
if (fileobj.name.indexOf("'") > -1) {
alert("名称不能包含以下字符:\\ / : * ? \' \" < > |");
return false;
}
else if (fileSize > maxSize) {
alert("请选择" + maxSize + "MB以内的文件上传。您当前文件大小为:" + fileSize.toFixed(2) + "MB");
return false;
}
else {
$("#xxx").html("<img src='/img/Processing.gif' />");//显示loading图片
return true;
}
}
}

方式二)

JS:

function checkFile(fileObj)
{
var max = 4;
var fso = new ActiveXObject("Scripting.FileSystemObject");
if(fso.GetFile(fileObj.value).size> max*1024*1024)
{
alert("附件不能超过" + max + "MB,请重新上传");
fileObj.outerHTML = fileObj.outerHTML;
fileObj.value = "";
}
var type = ".doc.wps.pdf";
if(type.indexOf(fileObj.value.substr(fileObj.value.lastIndexOf(".")).toLowerCase())==-1)
{
alert("文件格式必须为:" + type);
fileObj.outerHTML = fileObj.outerHTML;
fileObj.value = "";
}
}

如果使用JQuery,请将

fileObj.outerHTML = fileObj.outerHTML;
fileObj.value = "";

如果onchange在JS内加载,需要重新赋新的事件,修改为:

var newObj = fileObj.clone();
newObj.change(function () { checkFile($("#"+newObj.attr("id"))) });
newObj.val("");
fileObj.after(newObj);
fileObj.remove();

如果onchange在HTML标签内写明,则修改为:

fileObj.after(fileObj.clone().val(""));
fileObj.remove();

兼容各种浏览器哦~

JS获取上传文件的名称、格式、大小的更多相关文章

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

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

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

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

  3. js获取上传文件内容

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

  4. JS获取上传文件的绝对路径,兼容IE和FF

    <input type="file" id="fileBrowser" name="fileBrowser" size="5 ...

  5. js 获取上传文件的字节数及内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. JS 获取上传文件的内容

    <div> 上传文件 : <input type="file" name = "file" id = "fileId" / ...

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

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

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

    var maxsize = 6*1024*1024;//6M var errMsg = "上传的附件文件不能超过6M!!!"; var tipMsg = "您的浏览器暂不 ...

  9. js获取上传文件的绝对路径

    在html中    <input type="file" id="importFile" />    <input type="bu ...

随机推荐

  1. struts2配置的ajax参数传递方法

    在action.java ,struts.xml,js代码文件中,需要约定配置相同的参数名字,否则获取不了. 如下图.

  2. astyle 使用说明

    欢迎关注我的社交账号: 博客园地址: http://www.cnblogs.com/jiangxinnju GitHub地址: https://github.com/jiangxincode 知乎地址 ...

  3. Windows下快捷键

    1.任务管理器ctrl+alt+delete 2.切换任务窗口alt+tab 3.命令行Win+R 命令: {打开任务管理器:taskmgr} {打开远程桌面连接:mstsc} 4.回到桌面Win+D ...

  4. 20145218 《Java程序设计》第03次实验报告

    北京电子科技学院(BESTI)实验报告 课程:Java程序设计 班级:1452 指导教师:娄嘉鹏 实验日期:2016.04.22 实验名称:敏捷开发与XP实践 一.实验内容 XP基础 XP核心实践 相 ...

  5. [redis] Redis 配置文件置参数详解

    ################################ 基础配置 ################################# #daemonize no 默认情况下, redis 不 ...

  6. 琐碎的总结 css jQuery js 等等。。。

    jQuery  outerWidth(true)支持ie7 不错不错css  BFC   a {display:inline-block}  有用,block不是很有效果                ...

  7. python list对象

    list对象 1.list定义l=['first','second'] 2.list追加对象list.append('aa');append的方法总是把元素追加到末尾 insert(索引号,'项目') ...

  8. hdu----(4308)Saving Princess claire_(搜索)

    Saving Princess claire_ Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/ ...

  9. 20145236 《Java程序设计》实验四实验报告

    20145236 实验四 Android开发基础 实验内容: 1.基于Android Studio开发简单的Android应用并部署测试; 2.了解Android组件.布局管理器的使用: 3.掌握An ...

  10. 集合框架,ArrayList和Vector的区别,让arrayList线程安全的几种方案

    boolean add(E e) 将指定的元素添加到此列表的尾部. void add(int index, E element) 将指定的元素插入此列表中的指定位置. boolean addAll(C ...