Ajax如何实现文件上传

Q：Ajax如何实现文件上传？

A：这是个好问题。

因为一般情况下，通过表单提交实现文件上传是没有问题的，只需要将表单的enctype属性设置为multipart/form-data即可。例如：

<form action="/Home/uploadfiles/" enctype="multipart/form-data" method="post">

...

</form>

但是，如果表单数据需要验证，就希望通过JS来完成，如此一来也可能希望表单数据提交一并在JS中完成，特别是，如果需要立即获取提交后的结果反馈，那么通过Ajax来实现将是最好的选择。问题是，通常情况下，JS能获取的表单数据大多是文本或数字，如果遇到文件对象，该如何提交呢？

显然，文件对象不是简单的文本，JS直接从表单的文件对象控件里读取的值，也只是文件路径和文件名。我们需要提交的是文件对象本身，它提交的过程中应该是二进制的文件数据流。那么，该如何提交，这里我们就需要介绍一下JS的FormData类了。

FormData是JS专门为表单数据创建的一个对象，它可以存储任何的表单控件的数据，包括文件类型的数据。

它的定义和创建很简单：

var formData = new FormData();

然后，就可以使用append()方法向formData 中添加数据了。例如：

formData.append("名称"，值);

示例代码如下：

（HTML页面表单的代码）

（JS及其Ajax代码）

（服务端的代码以.NET MVC为例）

有兴趣的同学，复制以上代码，测试一下，多文件上传一招搞定哦！