因为我现在拿到的一个功能是上传时过滤掉很大尺寸的图片,所以需要来拿到上传时选择图片的size,所以有了这篇博文

不多说 上代码

$('input').change(function(e){

 1️⃣、console.log(e)==>得到的是什么呢

  得到的是:下面这些

  1. altKey:undefined
  2. bubbles:true
  3. cancelable:false
  4. ctrlKey:undefined
  5. currentTarget:input
  6. data:null
  7. delegateTarget:input
  8. detail:undefined
  9. eventPhase:2
  10. handleObj:Object
  11. isDefaultPrevented:h()
  12. jQuery22007808826687871413:true
  13. metaKey:undefined
  14. originalEvent:Event
  15. relatedTarget:undefined
  16. shiftKey:undefined
  17. target:input
  18. timeStamp:3956.0400000000004
  19. type:"change"
  20. view:undefined
  21. which:undefined
  22. __proto__:Object      

2️⃣、console.log(e.target)又会得到什么呢?

  得到的是input对象<input type="file" multiple="multiple" style="top: 91px; left: 44px; position: absolute; opacity: 0; z-index: 1000;">

3️⃣、console.log(e.target.files)呢,得到的又是什么呢?

  得到的是一串filelist

  1. FileList
    1. length:0
    2. __proto__:FileList

4️⃣、console.log(e.target.files[0])又能得到什么呢

  得到的是第一张input选择的图片的一些参数,得到的这些参数可以根据自己的需要提取,比如我现在需要的是size参数,e.target.files[0].size就可以拿到了,得到的单位是b哈

  1. File
    1. lastModified:1478486422000
    2. lastModifiedDate:Mon Nov 07 2016 10:40:22 GMT+0800 (CST)
    3. name:"222.jpg"
    4. size:124996
    5. type:"image/jpeg"
    6. webkitRelativePath:""
    7. __proto__:File

})

继续加油,一步一步

e.target.files[0]层层剖析的更多相关文章

  1. 《Netty5.0架构剖析和源码解读》【PDF】下载

    <Netty5.0架构剖析和源码解读>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230062545 内容简介 Netty 是个异步的 ...

  2. 在使用document.getElementById('xxx').files[0]时,关于计算图片大小

    在使用文件上传属性时,一直好奇图片上传的大小时如何计算的,最近在使用中认识到的计算方式:  首先,图片大小的存储基本单位是字节(byte).每个字节是由8个比特(bit)组成.所以,一个字节在十进制中 ...

  3. chrome 和IE 上传的文件,在net 后台取值Request.Form.Files[0].FileName 的不同

    chrome 和IE 上传的文件,在net 后台取值Request.Form.Files[0].FileName 的不同 chrome 获得的是不含路径的纯文件名 IE获得的是含路径的文件名

  4. com.jcraft.jsch.JSchException: java.io.FileNotFoundException: file:\D:\development\ideaProjects\salary-card\target\salary-card-0.0.1-SNAPSHOT.jar!\BOOT-INF\classes!\keystore\login_id_rsa 资源未找到

    com.jcraft.jsch.JSchException: java.io.FileNotFoundException: file:\D:\development\ideaProjects\sala ...

  5. $('xx')[0].files[0]

    ①首先得明白jQuery对象只能使用jQuery对象的属性和方法,JavaScript对象只能使用JavaScript对象的属性和方法: ②files[0]是JavaScript的属性: ③$('xx ...

  6. 干货|漫画算法:LRU从实现到应用层层剖析(第一讲)

    今天为大家分享很出名的LRU算法,第一讲共包括4节. LRU概述 LRU使用 LRU实现 Redis近LRU概述 第一部分:LRU概述 LRU是Least Recently Used的缩写,译为最近最 ...

  7. vue2.0细节剖析

    1.样式切换 单个切换样式 /*html部分*/ <div class="bg" v-bind:class="{active:isActive}"> ...

  8. 服务网格数据平面的关键:层层剖析Envoy配置

    Envoy是一种高性能C++分布式代理,专为单个服务和应用程序设计.作为Service Mesh中的重要组件,充分理解其配置就显得尤为重要.本文列出了使用Envoy而不用其他代理的原因.并给出了Env ...

  9. 由上而下层层剖析细说PCI+ExpresS+11新版精髓

    https://wenku.baidu.com/view/9a16c41fa300a6c30c229f87.html

随机推荐

  1. highchart导出图片

    http://www.cnblogs.com/jasondan/p/3504120.html 项目中需求导出报表为图片存到Excel中去,或供其它页面调用. 开始存到截屏,但由于用户电脑分辨率不一样, ...

  2. SQL 中 EXISTS 与 NOT EXISTS

    带有 EXISTS 操作符的子查询不返回任何数据,只产生逻辑真值 'true' 或逻辑假值 'false'.带有 EXISTS 操作符的子查询都是相关子查询. 相关子查询:子查询的条件依赖父查询. E ...

  3. MongoDB 创建 Database 和 Collection

    在开始使用MongoDB(Version:3.2.9)之前,必须首先在MongoDB中创建 Database 和 Collection.Database是相互独立的,每个Database都有自己的Co ...

  4. SQL Server中CTE的另一种递归方式-从底层向上递归

        SQL Server中的公共表表达式(Common Table Expression,CTE)提供了一种便利的方式使得我们进行递归查询.所谓递归查询方便对某个表进行不断的递归从而更加容易的获得 ...

  5. [转]自己写PHP扩展之创建一个类

    原文:http://www.imsiren.com/archives/572 比如我们要创建一个类..PHP代码如下 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 ...

  6. 连接 insance 到 vlan101 - 每天5分钟玩转 OpenStack(97)

    前面我们创建了 vlan101,今天继续部署 instance 到该 vlan network, 并讨论 instance 之间的连通性. launch 新的 instance "cirro ...

  7. 实践 Neutron 前的两个准备工作 - 每天5分钟玩转 OpenStack(78)

    上一节配置了 linux-bridge mechanism driver,本节再做两个准备工作: 1. 检视初始的网络状态.2. 了解 linux bridge 环境中的各种网络设备. 初始网络状态 ...

  8. Python快速教程 尾声

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 写了将近两年的Python快速教程,终于大概成形.这一系列文章,包括Python基 ...

  9. 解决FragmentTabHost切换标题栏变更问题

    现在都流行FragmentTabHost布局.但是所有的fragment都是共享一个actionbar,但是我们又想给每个fragment定义自定义的标题栏.百度google了好久也没有找到解决方案. ...

  10. css:图标与文字对齐的两种方法

    (好久没写博客了,这几个月的积累比较零碎,记在本子上,现在开始整理归类) 在平时写页面的过程中,常遇到要把小图标与文字对齐的情况.比如: 总结了两种方法,代码量都比较少. 第一种 对img设置竖直方向 ...