<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. ulua slua 下载地址

    ulua http://www.yanyulin.info/pages/2015/01/27193946190814.html   http://www.manew.com/blog-27966-25 ...

  2. C\C++头文件说明

    C\C++编程时候经常会遇到头文件问题而出现一系列的调试错误,下面我就简要的举例介绍一下头文件的作用,我们知道一个C\C++ 程序中开头一般都为: #include<iostream.h> ...

  3. phalcon: Windows 下 Phalcon dev-tools 配置 和 Phpstorm中配置Phalcon 代码提示, phalcon tools的使用

    准备: phalcon-devtools包 下载地址: https://github.com/phalcon/phalcon-devtools 解压到wampserver的www目录 (xampp 用 ...

  4. 教你开启红米的USB大容量存储选项,全网首发哦

    教你开启红米的USB大容量存储选项,全网首发哦 http://bbs.7to.cn/thread-10732-1-1.html 发表于 2014-4-29 110643 红米note入手也有两天了.各 ...

  5. 关于e820cycles参数

    关于e820cycles参数http://bbs.wuyou.net/forum.php?mod=redirect&goto=findpost&ptid=327458&pid= ...

  6. VB6 GDI+ 入门教程[6] 图片

    http://vistaswx.com/blog/article/category/tutorial/page/2 VB6 GDI+ 入门教程[6] 图片 2009 年 6 月 19 日 15条评论 ...

  7. 能源项目xml文件 -- app-init.xml

    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...

  8. 为学Linux 我看了这些书

    去年开始,抱着学习的态度开始了我的Linux学习,到现在,差不多一年了,收获很多,不敢说精通Linux,但是,还是对得起“略懂”这两个字的.这一年里我看了很多书,细细数下,大概15本左右,其中包含了两 ...

  9. python中的异常处理

    主要用到 try...except...raise...finally... 1. try...except... try: for i in range(1, 1000): print i time ...

  10. hdu---(3779)Railroad(记忆化搜索/dfs)

    Railroad Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...