xmlhttprequest在功能上无法正常工作

Question

有谁知道为什么upload.onprogress在单独的功能上不能正常工作？

代码工作正常（进度条缓慢移动）：

        xhr.upload.onprogress = function(e) {
            if (e.lengthComputable) {
                progress.value = (e.loaded / e.total) * 100;
            }
        };

但是，如果我将其投入功能，它将无法正常工作：

xhr.upload.onprogress = uploadProgress(event);

function uploadProgress(e) {
    if (e.lengthComputable) {
        progress.value = (e.loaded / e.total) * 100;
    }
}

在第二个代码上，进度条在文件上传完成后直接跳到100％，而不是在上传过程中很好地移到100％

因此，如果我将功能放进去，我已经尝试了提供的解决方案，它实际上可以工作。有没有办法把它放在函数之外？

        function uploadFile(blobFile, fileName) {
            ...
            ...

            // Listen to the upload progress for each upload.
            xhr.upload.onprogress = uploadProgress;

            // Progress Bar Calculation why it has to be in uploadFile function..
            function uploadProgress(e) {
                if (e.lengthComputable) {
                    progress.value = (e.loaded / e.total) * 100;
                }
            }

            uploaders.push(xhr);
            xhr.send(fd);
        }

        //it does not work if I put it outside the function. is there anyway to do this?  
        function uploadProgress(e) {
             if (e.lengthComputable) {
                 progress.value = (e.loaded / e.total) * 100;
             }
        }

Answer 1

通过uploadProgress(event);调用函数本身，并将返回值xhr.upload.onprogress分配给，而不是将其分配为回调函数：

xhr.upload.onprogress = uploadProgress;