如何處理Ajax圖片上傳的提交和更改事件？

Ajax上傳：提交與更改事件處理

問題概述：
增強現有表單的利用Ajax進行圖片上傳，提供的程式碼似乎不完整，需要額外

解：

1.使用Ajax 實作表單提交：

在表單提交的事件處理程序中，提供的程式碼缺少重要元素：

• 成功與錯誤函數： Ajax需要成功和錯誤函數來處理來自server.
• 表單數據： 要發送表單數據，請使用formData = new FormData(this);並將contentType 和processData 設為false 以實現Ajax 相容性。

修改程式碼：

$('#imageUploadForm').on('submit', (function(e) {
    e.preventDefault();
    var formData = new FormData(this);

    $.ajax({
        type: 'POST',
        url: $(this).attr('action'),
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        success: function(data) {
            console.log("success");
            console.log(data);
        },
        error: function(data) {
            console.log("error");
            console.log(data);
        }
    });
}));

2.在選取檔案時上傳上傳：

要在選擇檔案時啟動上傳，請在檔案輸入上使用變更事件：

$("#ImageBrowse").on("change", function() {
    $("#imageUploadForm").submit();
});

透過這些修改，Ajax上傳功能將按預期工作。

以上是如何處理Ajax圖片上傳的提交和更改事件？的詳細內容。更多資訊請關注PHP中文網其他相關文章！