<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. mybatis动态sql中的trim标签的使用

    trim标记是一个格式化的标记,可以完成set或者是where标记的功能,如下代码: 1. select * from user <trim prefix="WHERE" p ...

  2. 如何使用 declare-styleable

    如何使用 declare-styleable 在创建 xml 到 objectName/res/values/ 命名为 attrs.xml 编辑文件内容为(示例)<?xml version=&q ...

  3. CollectionFramework

  4. controller 监控Unix性能信息

    linux系统需要有RPC(Remote Procedure Call Protocol),远程过程调用协议,通过安装rpc.rstatd程序,启动其服务,就可以给远程机器提供信息,即Lr可以获取到该 ...

  5. Android FloatingActionButton(FAB) 悬浮按钮

    FloatingActionButton 悬浮按钮                                                                            ...

  6. sql server 导出数据到 Azure Hbase / Hive 详细步骤

    The Hadoop on Azure Sqoop Import Sample Tutorial Table of Contents   Overview   Goals Key technologi ...

  7. Qt之Threads和QObjects

    简述 QThread继承自QObject,它发射信号(signals)以表明线程执行开始或结束,并提供了一些槽函数(slots). 更有趣的是,QObjects可以在多线程中使用,发射信号以在其它线程 ...

  8. jsp 文件引入

    <!-- 清除浏览器中的缓存,它和其它几句合起来用,就可以使你再次进入曾经访问过的页面时,ie浏览器必须从服务端下载最新的内容,达到刷新的效果. --><meta http-equi ...

  9. Spring配置文件解析--bean属性

    1.bean设置别名,多个别名用逗号隔开 <!--使用alias--> <bean id="app:dataSource" class="...&quo ...

  10. oracle第一章

    1.oracle对比sqlserver oracle sqlserver 数据文件.dbf 数据文件.mdf 控制文件.ctl   日志文件.log 日志文件.log     2.内置用户 1.sys ...