Ajax上傳圖片

上傳圖片input的類型是file (以下圖)ajax

<input type='file' name='xxx' id='pic_img'>

當咱們選擇圖片文件時以下:api

 判斷是否爲空以下:app

if($('#pic_img').val() == ''){
    //爲空
}else{
    //不爲空
}

上傳到後臺以前要先加一個form把它包起來,並添加點擊按鈕上傳 以下:async

<form enctype="multipart/form-data" id="uploadForm">
      <input type='file' name='xxx' id='pic_img'>
      <input type='button' onclick='upload()' value='點擊上傳'>
 </form>

而後是js部分  經過ajax上傳url

function upload(){
    var formData = new FormData($("#uploadForm")[0])  //建立一個forData 
    formData.append('img', $('#pic_img')[0].files[0]) //把file添加進去  name命名爲img
    $.ajax({
        url: /api/v1/xxxx,
        data: formData,
        type: "POST",
        async: false,
        cache: false,
        contentType: false,
        processData: false,
        success: function(data) {
             //成功
        },
        error: function() {
              //失敗
        }
      })
}

OK就這麼簡單,後臺接收 name=img便可code

相關文章
相關標籤/搜索