分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

jQuery 实现下载进度条

发布时间:2023-09-06 02:35责任编辑:熊小新关键词: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) + "%"); ??????????} ????????} 

jQuery 实现下载进度条

原文地址:https://www.cnblogs.com/slightFly/p/10559254.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved