首頁 > 後端開發 > php教程 > 如何使用 jQuery 處理 FormData 的檔案上傳?

如何使用 jQuery 處理 FormData 的檔案上傳?

Patricia Arquette
發布: 2024-12-12 11:18:11
原創
804 人瀏覽過

How Can I Use jQuery to Handle File Uploads with FormData?

使用jQuery 序列化檔案上傳

使用jQuery 的serialize() 函數提交帶有檔案上傳欄位的表單時,可以擷取檔案數據具有挑戰性的。與其他表單元素不同,檔案輸入無法序列化為字串。

要繞過此限制,您可以使用 FormData 物件。 FormData 提供了一種將表單資料(包括文件)編碼為更適合提交的格式的方法。

以下程式碼片段示範如何使用 FormData 處理檔案上傳:

$(document).on("submit", "form", function(event) {
    event.preventDefault();
    $.ajax({
        url: $(this).attr("action"),
        type: $(this).attr("method"),
        dataType: "JSON",
        data: new FormData(this),
        processData: false,
        contentType: false,
        success: function (data, status) {

        },
        error: function (xhr, desc, err) {

        }
    });        

});
登入後複製

With透過此方法,FormData 建構函式擷取所有表單元素,包括檔案輸入。透過將 processData 設為 false 並將 contentType 設為 false,jQuery 不會嘗試序列化數據,從而使瀏覽器能夠正確處理檔案上傳。

在伺服器端,可以透過$_FILES 超全域數組,就像在傳統檔案上傳場景中一樣。

以上是如何使用 jQuery 處理 FormData 的檔案上傳?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板