zoukankan      html  css  js  c++  java
  • jQuery 实现下载进度条

    //ajax异步上传  
                $.ajax({  
                   url: "${pageContext.request.contextPath }/upload",  
                   type: "POST",  
                   data: formData,  
                   xhr: function(){ //获取ajaxSettings中的xhr对象,为它的upload属性绑定progress事件的处理函数  
                     
                       myXhr = $.ajaxSettings.xhr();  
                       if(myXhr.upload){ //检查upload属性是否存在  
                           //绑定progress事件的回调函数  
                           myXhr.upload.addEventListener('progress',progressHandlingFunction, false);   
                       }  
                       return myXhr; //xhr对象返回给jQuery使用  
                   },  
                   success: function(result){  
                       $("#result").html(result);  
                   },  
                   contentType: false, //必须false才会自动加上正确的Content-Type  
                   processData: false  //必须false才会避开jQuery对 formdata 的默认处理  
               });  
    //上传进度回调函数:  
           function progressHandlingFunction(e) {  
               if (e.lengthComputable) {  
                   $('#progress').attr({value : e.loaded, max : e.total}); //更新数据到进度条  
                   var percent = e.loaded/e.total*100;  
                   $('#progress').html(e.loaded + "/" + e.total+" bytes. " + percent.toFixed(2) + "%");  
                   $('#progress').css('width', percent.toFixed(2) + "%");
               }  
           } 
  • 相关阅读:
    HTML2
    HTML1
    MySQL进阶part4
    pymysql模块
    MySQL进阶part3
    MySQL进阶part2
    MySQL进阶part1
    java IO中的乱码问题
    解决在IDEA中无法使用Scanner输入的问题
    IDEA配置xml文件头报错:URI is not registered (Settings | Languages & Frameworks | Schemas and DTDs)
  • 原文地址:https://www.cnblogs.com/slightFly/p/10559254.html
Copyright © 2011-2022 走看看