前台使用ajax与后台进行文件传输

在网上想搜如何用jQuery与控制表单与后台进行文件传输

大部分的回答都是直接用form表单提交

然而我想要的是使用ajax技术将文件传到后台，经过后台的处理后再返回信息到前台

然后发现网友建议使用jQuery表单框架，如AjaxUploadFile，Uploadify

在这里想和大家分享一下如何使用ajax技术向后台传送文件

FormData

这是HTML5的前沿技术

这里有一个非常全面的讲解

这里也有

这里还有

欢迎大家去看

简单地讲述一下它的使用：

实例化FormData对象

// 实例化一个空对象
var data = new FormData();
// 也可以在实例化的时候将数据加入
var data = new FormData(obj);
// 一般网FormData对象中添加数据使用append()方法
data.append(ojb)
// 将想要传送的数据都添加到data中后，我们需要建一个HTTP请求
var request = new XMLHttpRequest();
// 然后使用open方法，选择传送的method和后台的URL
request.open("POST|GET", "URL");
// 最后，向后台发送我们的数据
request.send(data)

如何获取表单中选中的文件

var fileObj = document.getElementById(inputId).files[i];
// 切记，不可使用如下方式
var fileObj = $("#inputId")[0]
// 此种方法获取到的是HTML DOM元素，而不是文件

如何使用jQuery向后台传送file文件

// 获取要传输的文件------假设只有一个文件
var file = document.getElementById(inputId).files[0];
// ajax传输
$.ajax({
url: URL,
type: "POST",
async: false,
cache: false,
processData: false,// 告诉jQuery不要去处理发送的数据
contentType: false,// 告诉jQuery不要去设置Content-Type请求头
data: file,
success: function(data){
alert(data);
},
error: function(err) {
alert(err);
}
});