1. 程式人生 > >js檔案上傳程式碼

js檔案上傳程式碼

<script>
    $(#avatar).on('change',function(){
        //當檔案選擇狀態發生改變是會執行這個時間處理函式
        var files = $(this).prop('files');//獲取這個選擇的檔案
        if (!files.length) return; //如果沒有選擇檔案則返回
        //拿到我們要上傳的檔案
        var file = files[0];
        //FormData是html5中新增的成員,專門配合ajax操作使用者在客戶端與伺服器之間傳遞的二進位制數
        var data = new FormData();
        data.append('avatar', file); //avatar 是檔案上傳的那麼名稱,類似$_FILES['avatar']

        //ajax傳送請求
        var xhr = new XMLHttpRequest();
        xhr.open('POST','admin/api/upload.php');//post 提交 後面的是提交地址
        xhr.send(data);  //藉助form data傳遞檔案
        xhr.onload = function(){
            this.responseText;  //接收上傳後的返回值
        }
    })
</script>

注意:在js中和服務端都需要對檔案進行校驗,在服務端用$_FILES['avatar'] 來接收檔案上傳的資料.同時用 if($_FILES['avatar']=== UPLOAD_ERR_OK) 來判斷檔案是否上傳成功

可以用$ext = pathinfo($avatar['name'],PATHINFO_EXTEN);來獲取檔案的副檔名 例如png jpeg 注意前面沒有 點