16.关于 file API 和 formdata

Posted 2020-08-09 IC转行者兔子

1. 上一节中： $(‘#file‘)[0].files[0]。 写法不是很懂

参考 ： https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications

Using the File API, which was added to the DOM in html5, it‘s now possible for web content to ask the user to select local files and then read the contents of those files. This selection can be done by either using an HTML <input> element or by drag and drop.

 

Accessing selected file(s)EDIT
Consider this HTML:

<input type="file" id="input">
The File API makes it possible to access a FileList containing File objects representing the files selected by the user.

If the user selects just one file, it is then only necessary to consider the first file of the list.

Accessing one selected file using a classical DOM selector:

var selectedFile = document.getElementById(‘input‘).files[0];
Accessing one selected file using a jQuery selector:

var selectedFile = $(‘#input‘).get(0).files[0];

var selectedFile = $(‘#input‘)[0].files[0];

 

2.

Formdata的构造函数：https://developer.mozilla.org/zh-CN/docs/Web/API/FormData/FormData

参数

form 可选，一个HTML 上的<form>表单元素——这种方式创建的FormData对象会自动将form中的表单值也包含进去，包括文件内容也会被编码之后包含进去。

php利用 name = file 来查询就可以

3. chrome console.log 太好用