PHP AjaxUpload 是一個用于處理文件上傳的 PHP 擴展庫。它可以讓你使用 Ajax 技術進行文件上傳、實現多文件上傳、實現文件類型過濾、顯示上傳進度等。
例如,你有一個文章發布頁面,需要上傳文章封面圖片和內容中可能存在的其它圖片。這時就可以使用 AjaxUpload 來處理文件上傳,讓用戶上傳圖片時不必等待頁面刷新,而且還可以實現文件類型過濾并顯示上傳進度。
<!-- 引入 jQuery 庫及 AjaxUpload 插件 --> <script src="jquery.min.js"></script> <script src="jquery.ajaxupload.js"></script> <!-- HTML 代碼 --> <form id="articleForm"> <input type="file" name="cover" id="coverFile"> <input type="file" name="contentImg[]" id="contentImgFile" multiple> </form> <!-- AjaxUpload 配置 --> <script> $(function () { $('#coverFile, #contentImgFile').ajaxupload({ action: 'upload.php', params: {articleId: 1}, name: 'file', dataType: 'json', onSubmit: function (file, ext) { // 提交前的處理 }, onComplete: function (file, response) { // 完成后的處理 } }); }); </script>
如上所示,只需引入 jQuery 庫及 AjaxUpload 插件,然后配置相關參數即可實現文件上傳。
使用 AjaxUpload 還可以實現多文件上傳、文件類型過濾等功能。如下代碼實現了多文件上傳,限制為圖片類型(JPEG、PNG、GIF)。
<!-- HTML 代碼 --> <form id="articleForm"> <input type="file" name="contentImg[]" id="contentImgFile" multiple> </form> <!-- AjaxUpload 配置 --> <script> $(function () { $('#contentImgFile').ajaxupload({ action: 'upload.php', params: {articleId: 1}, multiple: true, name: 'file', dataType: 'json', allowedTypes: ['jpeg', 'jpg', 'png', 'gif'], onSubmit: function (file, ext) { // 提交前的處理 }, onComplete: function (file, response) { // 完成后的處理 } }); }); </script>
除了以上提到的功能,AjaxUpload 還可以顯示上傳進度、處理上傳錯誤、自定義參數等。具體使用請參考 AjaxUpload 官方文檔。