js前台检测上传图片大小的总结

最近一直在做上传图片的前端检测，不通过后台就完成这个动作。但实际是，实际效果差强人意。

html5的fileApi出来后，对文件的处理才变得方便了些，对它的简单介绍可以看我的前面的博客。现在支持的浏览器有（File API在Firefox,Chrome,Safari和Opera中得到了全面实现．而IE10和Android部分支持这个API．FileReader API在IE10和所有其他桌面浏览器，以及WebKit移动浏览空对空中得到了全面实现，其中包括Android3.0及以上版本）。支持的范围还是蛮好的。

接下来想做ie低版本的兼容，然而纯前台实现真的没有方法。网上方法有几种，理论上似乎可行，但真正在服务器上运行就歇菜了。

1、通过新建img图像对象方式

obj.select();//obj是input上传控件对象
obj.blur();
var nfile = document.selection.createRange().text;
var _src = nfile.replace(/\\/g,'/');
//EventUtil.addHandler(img,'load',function(event){//监听图像加载完成
// img.onreadystatechange=function(){//同上
img.οnlοad=function() {//同上if(img.readyState == "loaded" || img.readyState == "complete") {alert(img.fileSize);                    }}img.src = _src;document.selection.empty();

这种方式在本地还行，放到服务器上面，ie8上面得到的反馈就是图像对象没有初始化。也就是说服务器端根本就访问不了图片，这也不奇怪了。

2、通过ie activeX方式

     var fileSystem = new ActiveXObject("Scripting.FileSystemObject");       var file = fileSystem.GetFile (filePath);  //filePath文件路径  fileSize = file.Size;

这种方式服务器ie8得到的反馈是产生Automation 服务器不能创建对象，那是一个坑爹。

3、通过dynsrc的方式

1 var img=new Image();
2 obj_img.DYNSRC=obj_file.value;
3 filesize = obj_img.fileSize;

这种方式服务器ie8下报没有这个属性，不支持。

这三种方式ie9好像也不行，也没有再测了。

后来用了一个uplodify插件，但这个其实就是后台处理了。这个还是蛮不错的，测试都能检测到。

ps：

知乎上面的讨论差不多就是js检测大小的现状，

http://www.zhihu.com/question/21073708

还有2个网页可以作为参考，对新手有不少的帮助：

http://www.iteye.com/topic/137984

http://www.iteye.com/problems/38339

转载于:https://www.cnblogs.com/chendc/p/5390174.html

js前台检测上传图片大小的总结相关推荐

Javascript验证上传图片大小[前台处理]
2019独角兽企业重金招聘Python工程师标准>>> 需求分析: 在做上传图片的时候,如果不限制上传图片大小,后果非常的严重.那么我们怎样才可以解决一个棘手的问题呢?有两种方式: ...
JS获取当前对象大小以及屏幕分辨率等...
<!DOCTYPE html> <html> <head><meta charset="utf-8"/><meta name= ...
上传图片显示扫描效果html5,JS+HTML5实现上传图片预览效果完整实例【测试可用】...
本文实例讲述了JS+HTML5实现上传图片预览效果.分享给大家供大家参考,具体如下: 在项目中遇到用input标签file类型的文件上传,想实在上传之前进行图片的预览功能:之前的做的一个解决方案是文件 ...
[转]JS获取当前对象大小以及屏幕分辨率等
http://www.cnblogs.com/tearer/archive/2010/09/06/1819471.html JS获取当前对象大小以及屏幕分辨率等 Code highlighting p ...
Base64 JAVA后台编码与JS前台解码（解决中文乱码问题）
中文通过Java后台进行Base64编码后传到前台,通过JS进行Base64解码时会出现中文乱码的问题,被这个问题也是困扰了几天,使用jquery.base64.js只能转码非中文字符,经过搜集各种方 ...
php中上传图片的大小,php如何修改上传图片大小
php修改上传图片大小的方法:首先打开脚本文件:然后使用getimagesize函数获取图片尺寸:最后通过imagecreatetruecolor等函数方法修改图片大小即可. PHP修改图片大小的实现 ...
微信小程序：限制上传图片大小
微信小程序:限制上传图片大小 page({data:{Size:2*1024*1024,//定义大小}, )} //限制上传图片大小(2M)for(let i=0;i<res.tempFiles ...
js动态设置文字大小
js动态设置文字大小 <script>function setRem() {var ui_w = 375;// 获取屏幕的宽度var clientWidth = document.docu ...
Vue.js前台报Uncaught (in promise) cancel错误解决办法
今天做一个demo时碰到了Vue.js前台报Uncaught (in promise) cancel的错误,虽然不影响操作但是看见了心里不爽,于是在网上找了一些资料,总结如下原因: this.$co ...

js前台检测上传图片大小的总结

js前台检测上传图片大小的总结相关推荐

最新文章

热门文章