PHP和Ajax是一對強大的組合，可以實現異步加載和動態更新網頁內容，而百分比顯示則為用戶提供了一個直觀的進度反饋。在開發網站和應用程序時，這些功能對提高用戶體驗和增加交互性非常重要。
舉個例子，假設我們有一個圖片上傳功能，用戶可以通過選擇文件后，點擊上傳按鈕將其發送到服務器。使用傳統的上傳方式，用戶將需要等待上傳完成后才能看到結果，這可能需要很長時間。而使用PHP和Ajax進行異步上傳，則可以在上傳過程中，將進度以百分比的形式顯示給用戶，讓用戶知道上傳的進展情況。
實現這一功能的方法是在前端使用Ajax發送異步請求，在后端使用PHP處理上傳的文件。下面是一個示例代碼：
<html>
<head>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("#upload").on('click', function(){
var file_data = $("#file").prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: 'upload.php',
dataType: 'text',
type: 'post',
contentType: false,
processData: false,
data: form_data,
xhr: function(){
var xhr = new window.XMLHttpRequest();
xhr.upload.addEventListener("progress", function(evt){
if(evt.lengthComputable){
var percentComplete = evt.loaded / evt.total * 100;
$("#progress").text(percentComplete.toFixed(2) + '%');
}
}, false);
return xhr;
},
success: function(response){
$("#result").html(response);
}
});
});
});
</script>
</head>
<body>
<input type="file" id="file">
<button id="upload">上傳</button>
<p>進度：<span id="progress">0%</span></p>
<div id="result"></div>
</body>
</html>在這段代碼中，我們使用jQuery中的ajax函數發送異步請求。在xhr選項中，我們將上傳進度通過progress事件監聽，計算得到百分比后更新到頁面中的進度元素中。在后端的upload.php文件中，我們可以使用$_FILES來訪問上傳的文件，并對其進行處理，然后將結果返回給前端。
除了上傳文件，百分比顯示在其他場景中也非常有用。比如在一個長時間運行的任務中，比如數據處理、文件轉換等，我們可以使用百分比顯示任務的進度，讓用戶知道還剩下多少工作未完成。當任務完成后，我們也可以使用百分比反饋給用戶。
總之，PHP和Ajax的結合為我們提供了強大的異步加載和動態更新網頁內容的能力。而通過百分比顯示，我們可以更好地與用戶交互，提高用戶體驗。無論是上傳文件、長時間運行的任務，還是其他需要顯示進度的場景，使用這些技術配合百分比顯示，都會使我們的應用程序更加靈活強大。