ajax异步上传图片

首先需要注意分两种情况：

1： 小于等于ie8的情况：需要ajaxFileUpload.js，下载附件

if(navigator.userAgent.indexOf("MSIE 6.0")>0 || navigator.userAgent.indexOf("MSIE 7.0")>0 || navigator.userAgent.indexOf("MSIE 8.0")>0){
$.ajaxFileUpload({
url: "..url",
secureuri: false, // 一般设置为false
fileElementId: "upload_image_field", // 文件上传表单的id <input type="file" id="fileUpload" name="file" />
dataType: 'json', // 返回值类型 一般设置为json
success: function (data, status) {
var data = eval("(" + data + ")");
if(data.status == true){
...
}else{
.....
}

}
});
}


2：大于ie8的情况：


var fileObj = document.getElementById("upload_image_field").files[0]
if (typeof (fileObj) == "undefined" || fileObj.size <= 0) {
alert("请选择图片")
return
}
var formFile = new FormData();
formFile.append("action", "url...");
formFile.append("image", fileObj); //加入文件对象
var data = formFile;
$.ajax({
url: "url..",
data: data,
type: "Post",
dataType: "json",
cache: false,//上传文件无需缓存
processData: false,//用于对data参数进行序列化处理 这里必须false
contentType: false, //必须
success: function (data) {
var data = eval("(" + data + ")");
if(data.status == true){
...
}else{
...
}
}
})


注意： 如果不是直接点击文件框上传文件，例如点击图标来上传，要注意在ie8下直接trigger触发后，无法提交表单，可以把文件框设置为透明，然后覆盖图标。设置透明需要注意ie9以下不支持opacity，所以需要使用filter。filter:alpha(opacity=0);opacity: 0;，


input file 有的浏览器上on change只能执行一次，这样需要每执行完一次就替换掉该input文件框

$("#upload_image_field").replaceWith('<input type="file" name="image" id="upload_image_field" style="display: inline-block;width:30px;">')