首页 > Web开发 > 详细

html5 XMLHttpRequest 头像上传带进度

时间:2015-11-03 12:16:28      阅读:267      评论:0      收藏:0      [点我收藏+]
            function uploadFile() {
                popup(‘#msg‘, ‘正在上传头像‘, null, false);  
                var fd = new FormData();
                fd.append("fileToUpload", document.getElementById(‘headfile‘).files[0]);
                var xhr = new XMLHttpRequest();
                xhr.upload.addEventListener("progress", uploadProgress, false);
                xhr.addEventListener("load", uploadComplete, false);
                xhr.open("POST", url);
                xhr.send(fd);
            }
            function uploadProgress(evt) {
                if (evt.lengthComputable) {
                    var percentComplete = Math.round(evt.loaded * 100 / evt.total);
                    $(‘#msg>div>p‘).text(‘正在上传头像‘+ percentComplete.toString() + ‘%‘); 
                } 
            } 
            function uploadComplete(evt) {
                if (evt) {
                    $(‘#hidheadfile‘).val(evt.target.responseText);
                    popup(‘#msg‘, ‘头像上传成功,正在提交资料‘, null, false);
                }
                $.post(‘‘, $(‘#form‘).serialize(), function (d) {
                })
            } 
            if (document.getElementById(‘headfile‘).files.length > 0) {
                uploadFile();
            } else {
                uploadComplete();
            }

 

html5 XMLHttpRequest 头像上传带进度

原文:http://www.cnblogs.com/jmzs/p/4932687.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!