HTML5 文件API
filelist 表示文件对象的列表。
<form name="upload">
<input type="file" name="fileselect" multiple>
</form>
document.forms['upload']['fileselect'].files
得到的就是filelist。
拖放方式选择文件: drag drop
监听drop事件,dragOver事件
用拖放的方式选择文件,files 存放在 event.dataTransfer.files 里面。
用选择的放是选择文件,flies 存放在 event.target.files 里面。
文件URL: 为文件创建地址用 creatreObjectURL 方法,创建的是bolb类型地址。每次都会生成不同的地址。
var file = document.forms['upload']['fileselect'].files[0];
var url = window.URL.createObjectURL(file);
吊销地址:
window.URL.revokeObjectURL(url);
HTML5 文件API的更多相关文章
- 用html5文件api实现移动端图片上传&预览效果
想要用h5在移动端实现图片上传&预览效果,首先要了解html5的文件api相关知识(所有api只列举本功能所需): 1.Blob对象 Blob表示原始二进制数据,Html5的file对象就继 ...
- HTML5 文件API(一)
1.FileList对象与File对象 2.文件API之Bolb对象 A Blob object represents a file-like object of immutable, raw dat ...
- HTML5文件API之FileReader
在文件上传之前,我们总想预览一下文件内容,或图片样子,html5 中FileReader正好提供了2种方法,可以在不上传文件的情况下,预览文件内容. 图片预览:readAsDataURL(file); ...
- HTML5文件API
File对象与File对象 Blob对象 FileReader对象 File对象 <!DOCTYPE html> <html> <head> <meta ht ...
- HTML5 文件API(二)
1.FileSystem概述及浏览器检 2.申请磁盘配额 3.创建文件
- Resumable.js – 基于 HTML5 File API 的文件上传
Resumable.js 是一个 JavaScript 库,通过 HTML5 文件 API 提供,稳定和可恢复的批量上传功能.在上传大文件的时候通过每个文件分割成小块,每块在上传失败的时候,上传会不断 ...
- HTML5权威指南--标签新变化,文件API,拖放API(简要学习笔记一)
1.标签元素更加语义化 2.内容类型仍然为“text/html” 扩展符仍然为html或者htm. <1>DOCTYPE 声明<!DOCTYPE html>就可 ...
- HTML5 File API — 让前端操作文件变的可能
前言 在 HTML5 File API 出现之前,前端对于文件的操作是非常有局限性的,大多需要配合后端实现.出于安全角度考虑,从本地上传文件时,代码不可能获取文件在用户本地的地址,所以纯前端不可能完成 ...
- HTML5 file api读取文件的MD5码工具
1.工具的用途:用HTML5 file api读取文件的MD5码.MD5码在文件的唯一性识别上有很重要的应用,业内常用MD5进行文件识别.文件秒传.文件安全性检查等: 2.适用性:IE.Chrome皆 ...
随机推荐
- 2、Docker镜像和镜像管理
一.镜像介绍 1.定义 一个只读层被称为镜像,一个镜像是永久不会变的. 由于 Docker 使用一个统一文件系统,Docker 进程认为整个文件系统是以读写方式挂载的. 但是所有的变更都发生顶层的可写 ...
- python3 subprocess模块
当我们在执行python程序的时候想要执行系统shell可以使用subprocess,这时可以新起一个进程来执行系统的shell命令,python3常用的有subprocess.run()和subpr ...
- MOSFET的小信号模型和频率响应
这部分内容大部分参考W.Y.Choi的课堂讲义第三讲和第四讲:http://tera.yonsei.ac.kr/class/2007_1/main.htm 一.小信号模型 首先要明确一点,大部分情形M ...
- 现代OpenGL渲染管线介绍
原文摘选自 现代OpenGL渲染管线介绍 此文对最新的OpenGL做一个简单的介绍,如有理解错误,敬请指正.英文原文: https://glumpy.github.io/modern-gl.html ...
- 部署jar项目常用命令
netstat -tunlp | grep ×× 查询出端口为××在运行应用的线程ip kill -9 ×× 关闭线程ip 为 ××的应用 rm -f ××.jar ...
- MySQL数据库--外键约束及外键使用
什么是主键.外键关系型数据库中的一条记录中有若干个属性,若其中某一个属性组(注意是组)能唯一标识一条记录,该属性组就可以成为一个主键. 比如: 学生表(学号,姓名,性别,班级) 其中每个学生的学号是唯 ...
- 20135234mqy-——信息安全系统设计基础第十四周学习总结
第九章 虚拟存储器 主要作用: 将主存看作是一个存储在磁盘上的地址空间的高速缓存,在主存中只保护活动的区域,并根据需要在磁盘和主存之间来回传送数据: 为每个进程提供了一致的地址空间,从而简化了存储器管 ...
- Android TextView中图文混排设置行间距导致高度不一致问题解决
最近项目中需要实现一个评论带表情的功能,刚开始一切顺利,非常easy,突然有一天发现文字跟表情混排的时候,TextView中图文高度不一致,excuse...什么鬼,之前明明测试过图文混排,不存在这个 ...
- bzip2 以及 tar 压缩/解压缩/.打包等工具软件
1. bzip2 命令 基础格式: bzip2 [Options] file1 file2 file3 指令选项:(默认功能为压缩) -c //将输出写至标准输出 -d //进行解压操作 -v //输 ...
- Laravel 从入门到精通系列教程
转载;https://laravelacademy.org/laravel-tutorial-5_7 适用于 Laravel 5.5.5.6.5.7 版本,本系列教程将围绕一个 LTS 版本,然后采取 ...