首頁 > 後端開發 > php教程 > 如何使用AJAX顯示檔案上傳的即時進度?

如何使用AJAX顯示檔案上傳的即時進度?

Mary-Kate Olsen
發布: 2024-11-11 15:46:02
原創
187 人瀏覽過

How can AJAX be used to display real-time progress for file uploads?

檔案上傳狀態的AJAX 進度條

檔案上傳任務通常可能需要大量的處理時間,因此必須向使用者提供有進度更新。 AJAX 腳本可以透過提供即時進度資訊來滿足此要求。

AJAX 實作

在提供的範例中,執行類別有一個$progress 屬性,該屬性包含上傳進度(1-100) 和用於檢索它的get_progress() 方法。若要在前端顯示此進度,可以使用 AJAX。

這是一個簡化的AJAX 實作:

function updateProgressBar() {
  // Make an AJAX call to the PHP script
  $.ajax({
    url: "upload_status.php",
    success: function(data) {
      // Update the progress bar with the returned value
      $("#progress").val(data);
    }
  });
}
登入後複製

此函數定期輪詢PHP 腳本以檢索當前進度並更新

在PHP 腳本upload_status.php 中,您可以使用$executing_class->get_progress() 方法來取得進度值,並將其作為JSON回應回傳:

<?php
header('Content-Type: application/json');
echo json_encode(['progress' => $executing_class->get_progress()]);
登入後複製

透過使用計時器定期呼叫 updateProgressBar(),您可以持續向使用者顯示進度。

以上是如何使用AJAX顯示檔案上傳的即時進度?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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