jQuery 로 파일 업로드 file upload 로딩바 loading bar 구현하기

jQuery 로 파일 업로드 로딩바 구현하기

클라이언트 단에서 파일을 처리하는 로딩 바랄 구현하는 부분이며, 실제 서버에서 처리하는 부분은 없음을 알고 사용해야 합니다.

$.ajax({
    xhr: function() {
        var xhr = new window.XMLHttpRequest();

        xhr.upload.addEventListener("progress", function(evt) {
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                percentComplete = parseInt(percentComplete * 100);
                console.log(percentComplete);

                if (percentComplete === 100) {

                }

            }
        }, false);

        return xhr;
    },
    url: posturlfile,
    type: "POST",
    data: JSON.stringify(fileuploaddata),
    contentType: "application/json",
    dataType: "json",
    success: function(result) {
        console.log(result);
    }
});