<input type='file' />

inputDom.onchange=function (e){

  e.currentTarget.files  是只有一个对象的数组

  var obj = e.currentTarget.files[0]  是一个对象 上面有name、type、size等属性

  var windowURL = window.URL || window.webkitURL || window.mozURL 一个类

  var imgSrc = windowURL.createObjectURL(obj);  windowURL这个类上有一个createObjectURL的方法,能解析上面那个文件的obj,返回一个src,是一个二进制的大文件,类似 blob:null/19c43c4c-fd5d-4f5a-ae4e-08885e986017

  然后就能把图片写上src,然后显示  imgDom.style.src=imgSrc

}

input type=file的几个属性的更多相关文章

  1. python+selenium:解决上传文件<input type='file'>标签属性被css的visibility隐藏导致无法定位元素的问题

    要想上传文件,需要找到在HTML中<input type="file" />这个标签,有它就可以利用send_keys上传文件,不过这里的<input>元素 ...

  2. <input type="file"> accept属性筛选文件类型

    如果你不希望用户上传任何类型的文件, 你可以使用 input 的 accept 属性. 设置支持 .doc / .docx / .xls / .xlsx / .pdf 格式: <input ty ...

  3. jQuery 在IE下对表单中input type="file"的属性值清除

    对一个文件域(input type=file)使用了验证后,我们总会希望把文件域中的值给清空了,在IE中,由于安全设置的原因,是不允许更改文件域的值的,接下来为大家介绍一下解决方法 一般来说,在对一个 ...

  4. 原生HTML5 input type=file按钮UI自定义

    原生<input type="file" name="file" />长得太丑 提升一下颜值 实现方案一.设置input[type=file]透明度 ...

  5. 【原创】js中input type=file的一些问题

    1.介绍 在开发中,文件上传必不可少,input[type=file] 是常用的上传标签,但是它长得又丑.浏览的字样不能换,但是他长得到底有多丑呢.我们来看看在不同浏览器里的样子吧. <inpu ...

  6. <input type="file">火狐兼容

    <input type="file">放着a标签下火狐不兼容 <a href=""><input type="file& ...

  7. js 获取、清空 input type="file"的值 .(转)

    上传控件基础知识说明: 上传控件(<input type="file"/>)用于在客户端浏览并上传文件,用户选取的路径可以由value属性获取,但value属性是只读的 ...

  8. <input type="file" />浏览时只显示指定文件类型

    <input type="file" />浏览时只显示指定文件类型 <input type="file" accept="appli ...

  9. input type=file 标签禁止让用户手动输入

    常规的Web应用程序中涉及到文件上传的部分都不可避免地会使用到<input type="file"/>控件,在上传文件的时候通过点击“浏览”按钮,在弹出的文件选择对话框 ...

随机推荐

  1. mysql之数据库添加索引优化查询效率

    项目中如果表中的数据过多的话,会影响查询的效率,那么我们需要想办法优化查询,通常添加索引就是我们的选择之一: 1.添加PRIMARY KEY(主键索引) mysql>ALTER TABLE `t ...

  2. 学习EtherCAT的感想

    第一次进入到自动化领域,接触的第一个项目就是EtherCAT的测试.初次接触以太网,有一点茫然,百度看了很多关于EtherCAT的介绍,看了一些相关的论文.EtherCAT的资料很多:ETG1000. ...

  3. javaScript设计模式之面向对象编程(object-oriented programming,OOP)(二)

    接上一篇 面向对象编程的理解? 答:面向对象编程,就是将你的需求抽象成一个对象,然后针对这个对象分析其特征(属性)与动作(方法).这个对象我们称之为类.面向对象编程思想其中一个特点就是封装,就是把你需 ...

  4. 《前端之路》之二:数据类型转换 && 隐式转换 || 显式转换

    目录 02:数据类型转换 && 隐式转换 || 显式转换 02:数据类型转换 && 隐式转换 || 显式转换 在上一个章节中,我们介绍了 JavaScript 的基本的 ...

  5. kernel 进阶API

    1. #define cond_resched() ({ \ ___might_sleep(__FILE__, __LINE__, ); \ _cond_resched(); \ }) int __s ...

  6. Asp.Net Core 轻松学-项目目录和文件作用介绍

    前言     上一章介绍了 Asp.Net Core 的前世今生,并创建了一个控制台项目编译并运行成功,本章的内容介绍 .NETCore 的各种常用命令.Asp.Net Core MVC 项目文件目录 ...

  7. Android SDK 开发——发布使用踩坑之路

    前言 在 Android 开发过程中,有些功能是通用的,或者是多个业务方都需要使用的. 为了统一功能逻辑及避免重复开发,因此将该功能开发成一个 SDK 是相当有必要的. 背景 刚好最近自己遇到了类似需 ...

  8. 简单多播委托Demo

    namespace ConsoleApp4 { class Program { static void Main(string[] args) { Mum mum = new Mum(); Dad d ...

  9. CentOS下MySQL的安装

    MySQL数据库是一款比较常用的数据库,大家在练习安装时,可能会遇到各种各样的问题,请大家参考在CentOS系统下MySQL数据库的安装方式.如有任何问题,欢迎留言,本人随时解答. MySQL安装步骤 ...

  10. 2015年第六届蓝桥杯javaB组 试题 答案 解析

    1.三角形面积 如图1所示.图中的所有小方格面积都是1. 那么,图中的三角形面积应该是多少呢? 请填写三角形的面积.不要填写任何多余内容或说明性文字. ##### 答案 : 28   ### 2.立方 ...