AJAX（Asynchronous JavaScript and XML）是一種在網頁上實現異步通信的技術。在網頁開發中，經常需要用戶上傳圖片到指定的文件夾中，利用AJAX可以實現在不刷新整個頁面的情況下實現圖片上傳功能。

假設我們有一個網站，用戶可以在注冊時上傳自己的頭像。我們希望用戶上傳的頭像能夠保存在服務器的某個指定文件夾下。通過AJAX技術，我們可以實現這個需求。

首先，我們需要在網頁中添加一個包含上傳表單的HTML元素，例如一個form。然后，利用JavaScript監聽這個表單的提交事件，并使用AJAX發送請求到服務器上的一個處理圖片上傳的程序。最后，服務器接收到請求后將圖片保存到指定文件夾下并返回一個結果給客戶端。

// HTML部分
<form id="uploadForm" action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="file" id="file">
<input type="submit" value="上傳">
</form>
// JavaScript部分
document.getElementById('uploadForm').addEventListener('submit', function(e) {
e.preventDefault(); // 阻止表單的默認提交行為
var fileInput = document.getElementById('file');
var file = fileInput.files[0]; // 獲取用戶選擇的文件
var formData = new FormData(); // 創建一個FormData對象來保存文件數據
formData.append('file', file); // 將文件數據添加到formData對象中
var xhr = new XMLHttpRequest(); // 創建一個XMLHttpRequest對象
xhr.open('POST', 'upload.php', true); // 設置請求的類型、請求地址和是否異步
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) { // 請求完成且成功
var response = JSON.parse(xhr.responseText); // 將服務器返回的結果解析為JSON對象
if (response.success) {
alert('圖片上傳成功！');
} else {
alert('圖片上傳失敗，請重試！');
}
}
};
xhr.send(formData); // 發送請求并傳遞formData對象
});

在上面的代碼中，form元素的action屬性指定了處理圖片上傳的PHP程序的URL。當用戶提交表單時，JavaScript代碼通過監聽表單的提交事件來阻止表單的默認提交行為。接著，通過獲取file input中選擇的文件，創建一個FormData對象來保存文件數據，然后使用XMLHttpRequest對象來發送請求。

服務器上的PHP程序接收到請求后，通過$_FILES數組獲取上傳的文件，并使用move_uploaded_file函數將文件保存到指定文件夾下。PHP程序可以根據需要對文件進行大小、類型等校驗。

<?php
$targetDir = 'uploads/'; // 指定保存上傳文件的文件夾
$targetFile = $targetDir . basename($_FILES['file']['name']); // 獲取目標文件的路徑
$uploadSuccess = move_uploaded_file($_FILES['file']['tmp_name'], $targetFile);
if ($uploadSuccess) {
$response = array('success' =>true);
} else {
$response = array('success' =>false);
}
echo json_encode($response); // 返回結果給客戶端
?>

在上述PHP程序中，$_FILES數組中包含了文件的相關信息。首先，我們指定一個文件夾來保存上傳的文件，然后通過move_uploaded_file函數將臨時文件移動到指定文件夾中。如果移動成功，則返回一個包含'success'為true的JSON對象，否則返回'success'為false的JSON對象。

通過AJAX技術，我們實現了在網頁上上傳圖片至指定文件夾的功能。通過監聽表單的提交事件，獲取用戶選擇的文件并發送到服務器端，服務器端接收文件并進行保存。在服務器返回結果后，我們可以根據結果進行相應的處理，例如顯示上傳成功或上傳失敗的提示信息。

總結起來，通過AJAX上傳圖片至指定文件夾的過程可以分為以下幾個步驟：在網頁上添加上傳表單，使用JavaScript監聽表單的提交事件，通過FormData對象保存文件數據，使用XMLHttpRequest對象發送請求，服務器端接收文件并進行保存，返回結果給客戶端。這種方式不僅實現了圖片上傳功能，而且能夠在不刷新整個頁面的情況下實現文件上傳，提升了用戶體驗。