e.target.files[0]层层剖析
因为我现在拿到的一个功能是上传时过滤掉很大尺寸的图片,所以需要来拿到上传时选择图片的size,所以有了这篇博文
不多说 上代码
$('input').change(function(e){
1️⃣、console.log(e)==>得到的是什么呢
得到的是:下面这些
- altKey:undefined
- bubbles:true
- cancelable:false
- ctrlKey:undefined
- currentTarget:input
- data:null
- delegateTarget:input
- detail:undefined
- eventPhase:2
- handleObj:Object
- isDefaultPrevented:h()
- jQuery22007808826687871413:true
- metaKey:undefined
- originalEvent:Event
- relatedTarget:undefined
- shiftKey:undefined
- target:input
- timeStamp:3956.0400000000004
- type:"change"
- view:undefined
- which:undefined
- __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
- FileList
- length:0
- __proto__:FileList
4️⃣、console.log(e.target.files[0])又能得到什么呢
得到的是第一张input选择的图片的一些参数,得到的这些参数可以根据自己的需要提取,比如我现在需要的是size参数,e.target.files[0].size就可以拿到了,得到的单位是b哈
- File
- lastModified:1478486422000
- lastModifiedDate:Mon Nov 07 2016 10:40:22 GMT+0800 (CST)
- name:"222.jpg"
- size:124996
- type:"image/jpeg"
- webkitRelativePath:""
- __proto__:File
})
继续加油,一步一步
e.target.files[0]层层剖析的更多相关文章
- 《Netty5.0架构剖析和源码解读》【PDF】下载
<Netty5.0架构剖析和源码解读>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230062545 内容简介 Netty 是个异步的 ...
- 在使用document.getElementById('xxx').files[0]时,关于计算图片大小
在使用文件上传属性时,一直好奇图片上传的大小时如何计算的,最近在使用中认识到的计算方式: 首先,图片大小的存储基本单位是字节(byte).每个字节是由8个比特(bit)组成.所以,一个字节在十进制中 ...
- chrome 和IE 上传的文件,在net 后台取值Request.Form.Files[0].FileName 的不同
chrome 和IE 上传的文件,在net 后台取值Request.Form.Files[0].FileName 的不同 chrome 获得的是不含路径的纯文件名 IE获得的是含路径的文件名
- 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 ...
- $('xx')[0].files[0]
①首先得明白jQuery对象只能使用jQuery对象的属性和方法,JavaScript对象只能使用JavaScript对象的属性和方法: ②files[0]是JavaScript的属性: ③$('xx ...
- 干货|漫画算法:LRU从实现到应用层层剖析(第一讲)
今天为大家分享很出名的LRU算法,第一讲共包括4节. LRU概述 LRU使用 LRU实现 Redis近LRU概述 第一部分:LRU概述 LRU是Least Recently Used的缩写,译为最近最 ...
- vue2.0细节剖析
1.样式切换 单个切换样式 /*html部分*/ <div class="bg" v-bind:class="{active:isActive}"> ...
- 服务网格数据平面的关键:层层剖析Envoy配置
Envoy是一种高性能C++分布式代理,专为单个服务和应用程序设计.作为Service Mesh中的重要组件,充分理解其配置就显得尤为重要.本文列出了使用Envoy而不用其他代理的原因.并给出了Env ...
- 由上而下层层剖析细说PCI+ExpresS+11新版精髓
https://wenku.baidu.com/view/9a16c41fa300a6c30c229f87.html
随机推荐
- 美图WEB开放平台环境配置
平台环境配置 1.1.设置crossdomain.xml 下载crossdomain.xml文件,把解压出来的crossdomain.xml文件放在您保存图片或图片来源的服务器根目录下,比如: htt ...
- easyui 数据库修改部分(基于数据添加逻辑功能修改)
{iconCls:'icon-edit',text:'修改', handler:function(){ type="edit"; //判断是否选中一条数据 var data = $ ...
- HTML5应用缓存机制
首先先上一张图: 用360浏览器的用户对这张图应该都是耳熟能详了吧,没错,当网络不通畅时使用360浏览器,便会有这张图弹出来.为什么没有网络还能弹出这一副画面呢?这就关乎HTML5的应用缓存机制了. ...
- 【Win10 应用开发】从前台应用触发后台任务
有关后台任务的使用,估计大伙伴们不会陌生,而且老周曾经在某文中也简单讲述过.说到后台任务,老周想到了一个问题:有人问,后台任务一定要独立写到一个Runtime组件中吗,能不能写到主项目的代码中? 老周 ...
- Torch学习笔记1--Torch简介
Torch是什么 Torch是一个由Lua语言开发的深度学习框架,目前支持Mac OS X 和Ubuntu 12及以上,官网 ,github地址. 具有如下特点: 交互式开发工具 可视化式的工具 第三 ...
- Android数据存储之Sqlite的介绍及使用
前言: 本来没有打算整理有关Sqlite数据库文章的,最近一直在研究ContentProvider的使用,所有觉得还是先对Sqlite进行一个简单的回顾,也方便研究学习ContentProvider. ...
- Oracle Database 11g Express Editon介绍及安装
一.Oracle Database 11g Express版本介绍 公司项目开发中,使用的数据库是Oracle 10g和MySQL 5.5,最新因为开发需要,需要从后台读取一些数据.使用的客户端是PL ...
- MUI APP防止登陆页面出现白屏
最近在用MUI开发APP,总体效果,在IOS上,是完美的,但是在低端的Android手机上,就会出现性能问题,我个人觉得最严重的是,就是首页,就是APP打开的第一个页面,在iOS上,由于性能高,所以, ...
- iOS编译FFmpeg、kxmovie实现视频播放 (转载)
由于FFmpeg开源框架的功能非常强大,可以播放的视频种类很多,同时添加第三方库kxmovie,实现视频播放,真的是爽爆了,因此今天来说一下关于FFmpeg在iOS手机上的一些配置过程,配置工具,还有 ...
- Android动画的理解
基础知识 在我们开始讲Android动画这个知识点之前,我们了解下相应的基础知识点. Shape篇 一般用Shape定义的XML文件是存放在Drawable目录下,广泛应用于在Button.TextV ...