Ajax上传图片

 

css：

.file {
    position: relative;
    display: block;
    background: #D0EEFF;
    width:120px;
    height: 35px;
    line-height: 35px;
    color: #075db3;
    text-decoration: none;
    text-align: center;
    border-radius: 3px;
}
.file input#upload{
    position: absolute;
    width:100%;
    height: 100%;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}

html：

<a href="javascript:;" class="file">选择文件
    <input type="file" title=" " id="upload" />
</a>

js：

$("#upload").change(function(){
    //创建FormData对象
    var formData = new FormData();
    //为FormData对象添加数据
    formData.append('file', $("#upload")[0].files[0]);
    $.ajax({
        url:'/uploadFile',
        dataType: 'json',
        type:'POST',
        cache: false, //上传文件不需要缓存
        data:formData,
        processData: false, // 告诉jQuery不要去处理发送的数据
        contentType: false, // 告诉jQuery不要去设置Content-Type请求头
        success:function(data){

        },
        error: function (data) {
        }
    });
});