如何使用 JavaScript 在上傳前檢查檔案大小？

在 JavaScript 上傳前檢查檔案大小

利用 JavaScript 的進階功能，可以在上傳前驗證檔案大小。這可以確保遵守大小限制，防止伺服器端問題或由於大檔案大小而導致用戶沮喪。

解決方案：檔案 API

檔案 API 提供了一個簡單的方法與客戶端檔案互動的方式。這是一個實際範例：

document.getElementById("btnLoad").addEventListener("click", function showFileSize() {
  // Check for browser support
  if (!window.FileReader) {
    console.log("File API not supported");
    return;
  }

  var input = document.getElementById("fileinput");

  // Check for selected file
  if (!input.files || !input.files[0]) {
    addPara("Select a file first");
  } else {
    var file = input.files[0];
    addPara("File " + file.name + " is " + file.size + " bytes in size");
  }
});

此腳本：

1. 監聽「載入」按鈕的點擊。
2. 檢查檔案 API 支援並發出警告如果不可用。
3. 從 存取選定的檔案
4. 在文件正文中記錄檔案大小。

透過將此腳本整合到您的上傳表單中，您可以有效防止大檔案提交並提供無縫的使用者體驗。

以上是如何使用 JavaScript 在上傳前檢查檔案大小？的詳細內容。更多資訊請關注PHP中文網其他相關文章！