文章地址: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(学习到的知识)的更多相关文章

  1. FileReader与URL.createObjectURL实现图片、视频上传前预览

    之前做图片.视频上传预览常用的方案是先把文件上传到服务器,等服务器返回文件的地址后,再把该地址字符串赋给img或video的src属性,这才实现所谓的文件预览.实际上这只是文件“上传后再预览”,这既浪 ...

  2. hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...

  3. html之file标签 --- 图片上传前预览 -- FileReader

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  4. 【转】HTML5 jQuery图片上传前预览

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images,本例子主要是使用HTML5 的File API,建立一個可存取到该 file的url,一个空的img标签,ID为img0,把选 ...

  5. ASP.NET MVC图片上传前预览

    回老家过春节,大半个月,在家的日子里,吃好睡好,人也长了3.5Kg.没有电脑,没有网络,无需写代码,工作上相关的完全放下......开心与父母妻儿过个年,那样的生活令Insus.NET现在还在留恋.. ...

  6. HTML5 jQuery图片上传前预览

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images,本例子主要是使用HTML5 的File API,建立一個可存取到该file的url,一个空的img标签,ID为img0,把选择 ...

  7. file标签 - 图片上传前预览 - FileReader & 网络图片转base64和文件流

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  8. input file实现多选,限制文件上传类型,图片上传前预览功能

    限制上传类型 & 多选:① accept 属性只能与 <input type="file" /> 配合使用.它规定能够通过文件上传进行提交的文件类型. ② mu ...

  9. 【转】html之file标签 --- 图片上传前预览 -- FileReader

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  10. HTML5 FileReader实现图片上传前预览

    如果你的浏览器支持Html5的FileReader的话,实现图片上传前进行预览是一件非常容易之事情. 在控制器,创建一个视图Action: jQuery代码: 实时演示一下: 下面内容于2014-11 ...

随机推荐

  1. PowerDesigner跟表的字段加注释

    选择那个表 右键- >Properties- >Columns- >Customize Columns and Filter(或直接用快捷键Ctrl+U)- >Comment( ...

  2. poj 1149 Pigs 网络流-最大流 建图的题目(明天更新)-已更新

    题目大意:是有M个猪圈,N个顾客,顾客要买猪,神奇的是顾客有一些猪圈的钥匙而主人MIRKO却没有钥匙,多么神奇?顾客可以在打开的猪圈购买任意数量的猪,只要猪圈里有足够数量的猪.而且当顾客打开猪圈后mi ...

  3. Kia&#39;s Calculation(贪心)

    pid=4726">http://acm.hdu.edu.cn/showproblem.php? pid=4726 大致题意:给两个长度小于10^6且相等的合法的正整数.你能够随意组合 ...

  4. LabVIEW设计模式系列——资源关闭后错误处理

    标准: 1.很多引用资源其打开函数和关闭函数对错误处理的方式有所不同:2.一般地NI的Help里对打开函数的错误端子的解释是这样的:如错误发生在VI或函数运行之前,VI或函数将把错误输入值传递至错误输 ...

  5. Cocos2d-x中常用粒子编辑器ParticleDesigner测试例子

    打开 ParticleDesigner 随意选择一种效果 选择save. 类型选择 cocosd(plist)类型保存至桌面 命名为myplist导出至桌面 选择右侧Emitter Config可设置 ...

  6. JAVA格式化时间日期

    JAVA格式化时间日期 import java.util.Date; import java.text.DateFormat; /** * 格式化时间类 * DateFormat.FULL = 0 * ...

  7. update inner join

    string sql = @"update a set a.M_ParentID=b.M_ParentID, a.M_Name=b.M_Name, a.M_Seq=b.M_Seq from ...

  8. width:100% 和 max-width:100%; 有区别吗【转藏】

    这个博客是基于“Pelican+Markdown+定制的my-gum主题”的.定制的主题将博文正文页面的 右边栏去掉,这导致在Firefox等浏览器中,正文中大的图片会突破正文块的宽度,高度也得不到限 ...

  9. mybatis中几种typeHandler的定义使用

    1.存储到数据库, 将LONG数组转换成字符串;从数据库获取数据, 将字符串转为LONG数组 package com.winturn.utils.handler; import java.sql.Ca ...

  10. MES项目中出现的一个事务嵌套的使用场景

    昨天在MES项目中,需要在业务逻辑的几个关键点记录错误信息,需要把错误信息写入数据表. 但是由于整个业务逻辑都是包在一个事务模板里面的 比如这样的: WhhTransactionTemplate tr ...