前端图片预览,上传前预览,兼容IE7、8、9、10、11,Firefox,Chrome(学习到的知识)
文章地址:http://www.cnblogs.com/rubylouvre/p/4597344.html
一、window.URL

- 在Chrome中,window.URL和window.webkitURL都存在
- 在Firefox中,仅Window.URL存在
- 在IE11(Edge),10中仅window.URL存在
- 在IE7、8、9中不存在window.URL
- 在IE中能通过FileObject 的value 属性获取文件全路径
- 在Chrome中无法获取FileObject的全路径,得到的是一个假路径
- 在Firefox中根本获取不到路径,得到的是一个文件名
- 在IE7、8、9中无法获取到FileObject的files属性

- window.URL中的方法

二、上传过程使用滤镜预览图片
一般在网页(JSP或HTML)中要显示图片,我们可以用src=xxxx的路径的方式去显示,但是在web应用中,这是无效的,因为src后跟的是文件路径,如果是单单一个页面是没问题,如果是项目工程中的话,就必须是在该项目下的路径,这样如果是上传的图片就显示不了。因此我们可以用src后跟流的方式显示图片,或者使用滤镜

前端图片预览,上传前预览,兼容IE7、8、9、10、11,Firefox,Chrome(学习到的知识)的更多相关文章
- FileReader与URL.createObjectURL实现图片、视频上传前预览
之前做图片.视频上传预览常用的方案是先把文件上传到服务器,等服务器返回文件的地址后,再把该地址字符串赋给img或video的src属性,这才实现所谓的文件预览.实际上这只是文件“上传后再预览”,这既浪 ...
- hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images
hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...
- html之file标签 --- 图片上传前预览 -- FileReader
记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...
- 【转】HTML5 jQuery图片上传前预览
hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images,本例子主要是使用HTML5 的File API,建立一個可存取到该 file的url,一个空的img标签,ID为img0,把选 ...
- ASP.NET MVC图片上传前预览
回老家过春节,大半个月,在家的日子里,吃好睡好,人也长了3.5Kg.没有电脑,没有网络,无需写代码,工作上相关的完全放下......开心与父母妻儿过个年,那样的生活令Insus.NET现在还在留恋.. ...
- HTML5 jQuery图片上传前预览
hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images,本例子主要是使用HTML5 的File API,建立一個可存取到该file的url,一个空的img标签,ID为img0,把选择 ...
- file标签 - 图片上传前预览 - FileReader & 网络图片转base64和文件流
记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...
- input file实现多选,限制文件上传类型,图片上传前预览功能
限制上传类型 & 多选:① accept 属性只能与 <input type="file" /> 配合使用.它规定能够通过文件上传进行提交的文件类型. ② mu ...
- 【转】html之file标签 --- 图片上传前预览 -- FileReader
记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...
- HTML5 FileReader实现图片上传前预览
如果你的浏览器支持Html5的FileReader的话,实现图片上传前进行预览是一件非常容易之事情. 在控制器,创建一个视图Action: jQuery代码: 实时演示一下: 下面内容于2014-11 ...
随机推荐
- Spring框架:Spring容器具体解释
Spring容器 Spring容器能够帮助你管理所有的Bean对象.专业术语称之为IoC控制反转.在传统的程序中.对象的生成都是由开发人员完毕的.而在控制反转中,对象的生成所有都交给框架完毕.这种优点 ...
- 微软Office与金山WPS Office有何私密关系?
新浪科技讯,9月1日午间消息,国家工商总局在其官网公布消息称.对微软公司副总裁陈实进行反垄断调查询问,要求微软就其综合情况以及企业反映的微软公司Windows操作系统和Office办公软件相关信息没有 ...
- 通过源码看android系列之multidex库
我们在开发项目时,喜欢引入好多的第三方包,大大的方便了我们的开发,但同时,因为android方法总数的限制,不能超过65k,然而呢,随着我们的开发,65k最终还是会超过,所以,google就给出了这个 ...
- VC++ 响应回车键的2种方法
众所周知,VC++响应回车键经常用的方法是利用 BOOL PreTranslateMessage(MSG* pMsg) 截取回车键消息,如: if (pMsg->message == WM_KE ...
- pnd3
这两天重写了,消除后本身的下落计算还有问题,新产生的块下落和消除已经OK了.消除算法真的很要命.最后还是回归最开始的想法,用递归的方式不断的SPREAD来得到消除的数据.快到月底了,得勤写写了,要不找 ...
- Linux自动化运维部署+运维
自动化部署及配置(Cobbler/Kickstart) 红帽发布的网络安装服务器套件 Cobbler可以说是一大Linux装机利器,可以快速的建立网络安装环境,据说比Kickstart还要好用. 分布 ...
- Linux下安装、配置、授权、调优Mysql
以前在linux已经安装了很多次的Mysql,但是时间间隔长了以后,安装步骤总是会遗漏,趁这次安装,做一下安装记录. 检查系统是否已经安装Mysql rpm -qa|grep -i mysql Mys ...
- BZOJ 1044 木棍分割
二分+dp. #include<iostream> #include<cstdio> #include<cstring> #include<algorithm ...
- http://bbs.phpcms.cn/thread-266337-1-1.html
http://bbs.phpcms.cn/thread-266337-1-1.html utf8 改成 ANSI”
- .NET生成PDF文件
C#未借助第三方组件,自己封装通用类,生成PDF文件. 调用方式: //路径 string path = @"C:\yuannwu22.pdf"; //内容 string strC ...