AJAX是一種前端技術，可以通過無需刷新頁面的方式向后端發送請求，并通過異步返回數據。在Web開發中，常常需要通過表單來上傳圖片，傳統的表單提交會導致頁面刷新，影響用戶體驗。而利用AJAX技術可以實現無刷新上傳圖片，提升用戶交互體驗。

舉個例子來說明，假設我們正在開發一個圖片分享網站，用戶需要通過表單來上傳圖片。傳統的做法是用戶選擇圖片后，提交表單，然后等待服務器處理完成并重新加載頁面來顯示上傳的圖片。但是這種方式不僅用戶需要等待，還會導致頁面刷新，給用戶造成不必要的干擾。

如果使用AJAX技術，用戶選擇圖片后，可以通過AJAX發送異步請求，將圖片數據發送給后端處理，而不需要刷新整個頁面。后端處理完畢后，可以返回處理結果，例如圖片的URL等。前端可以通過JavaScript將處理結果展示給用戶，無需刷新頁面。

下面是一個示例代碼，演示如何使用AJAX提交表單中的圖片：

<form id="myForm" enctype="multipart/form-data">
<input type="file" name="file" id="fileInput">
<input type="submit" value="Upload" id="submitBtn">
</form>
<script>
// 監聽表單的提交事件
document.getElementById("myForm").addEventListener("submit", function (event) {
event.preventDefault(); // 阻止表單默認提交行為
var fileInput = document.getElementById("fileInput");
var file = fileInput.files[0];
var formData = new FormData(); // 創建FormData對象
formData.append("file", file); // 將文件添加到formData中
var xhr = new XMLHttpRequest(); // 創建XMLHttpRequest對象
xhr.open("POST", "/upload", true); // 打開POST請求，上傳地址為/upload
xhr.onload = function () {
if (xhr.status === 200) {
var response = JSON.parse(xhr.responseText); // 解析服務器返回的JSON數據
var imageUrl = response.imageUrl; // 獲取圖片的URL
var imageElement = document.createElement("img"); // 創建img元素
imageElement.setAttribute("src", imageUrl); // 設置圖片URL
document.body.appendChild(imageElement); // 在頁面上顯示上傳的圖片
}
};
xhr.send(formData); // 發送請求數據：formData
});
</script>

在上述代碼中，我們首先監聽表單的提交事件，并阻止默認的表單提交行為。接著，通過JavaScript獲取文件輸入框中的文件數據，并創建一個FormData對象。然后，通過XMLHttpRequest對象創建一個POST請求，將FormData作為請求的數據發送給服務器。

在服務器處理完畢后，返回的結果會在XMLHttpRequest對象的onload回調函數中被處理。我們可以解析服務器返回的JSON數據，提取出圖片的URL。然后，通過創建img元素，并將圖片URL設置到該元素的src屬性上，最后將該img元素添加到頁面中，完成圖片的展示。

總結來說，通過使用AJAX技術可以實現無刷新上傳圖片，提升用戶交互體驗。用戶可以在上傳圖片時無需等待頁面刷新，而是通過監聽表單的提交事件，并使用XMLHttpRequest對象將圖片文件數據異步發送給服務器。服務器在處理完畢后，可以返回處理結果，前端通過處理結果展示給用戶。