分享web开发知识

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

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

jquery获取上传进度和取消上传操作

发布时间:2023-09-06 02:09责任编辑:苏小强关键词:暂无标签
var xhrOnProgress=function(fun) { ?????????????xhrOnProgress.onprogress = fun; //绑定监听 ?????????????//使用闭包实现监听绑 ?????????????return function() { ???????????????//通过$.ajaxSettings.xhr();获得XMLHttpRequest对象 ???????????????var xhr = $.ajaxSettings.xhr(); ???????????????//判断监听函数是否为函数 ???????????????if (typeof xhrOnProgress.onprogress !== ‘function‘) ?????????????????return xhr; ???????????????//如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去 ???????????????if (xhrOnProgress.onprogress && xhr.upload) { ?????????????????xhr.upload.onprogress = xhrOnProgress.onprogress; ???????????????} ???????????????return xhr; ?????????????} ???????} ???????//文件上传 快速 ???????function newFileUpload(_this){ ???????????var fd = new FormData(); ???????????fd.append("paragram", 12345); //上传的参数名 参数值 k-v键值对 ???????????fd.append("upfile", $("#upfile").get(0).files[0]);//上传的文件file ???????????ajaxRe =$.ajax({ ???????????????url: "${ctx}/platform/system/sysFile/fileUpload.ht", ???????????????type: "POST", ???????????????processData: false, ???????????????contentType: false, ???????????????data: fd, ???????????????success: function(data) { ???????????????????$("#loading_upload").hide(20); ?????????????????????var fileId=JSON.parse(data).fileId; ???????????????????var fileName=JSON.parse(data).fileName; ???????????????????$("#fileList_upload").html($("#fileList_upload").html()+‘<div style="font-size:15px;height:28px;line-height:28px"><span fileid="‘+fileId+‘" name="attach" file="‘+fileId+‘,‘+fileName+‘" res="oa" filename="‘+fileName+‘">‘+fileName+‘</span>&nbsp;&nbsp;<img onclick="AttachMent.download(this);" style="width:15px;height:15px" src="/oa/styles/common/img/enclosure/download.png">&nbsp;&nbsp;<img onclick="AttachMent.view(this);" style="width:15px;height:15px" src="/oa/styles/common/img/enclosure/preview.png">&nbsp;&nbsp;<img onclick="mailDelFile(‘+fileId+‘,this);" style="width:15px;height:15px" src="/oa/styles/common/img/enclosure/delete.png"></div>‘) ???????????????????var obj={}; ???????????????????obj.id=fileId ???????????????????obj.name=fileName ???????????????????uploadArr.push(obj); ???????????????????$("#filelist").html(JSON.stringify(uploadArr)); ???????????????????$("#upfile").val("") ???????????????}, ???????????????xhr:xhrOnProgress(function(e){ ???????????????????var percent=e.loaded / e.total * 100;//计算百分比 ???????????????????$("#progess").html(percent.toFixed(2)); ???????????????}), ???????????????beforeSend: function(){ ??????????????????????$("#loading_upload").show(20); ?????????????????}, ???????????}) ???????????????????} ???????function canceled_upload(){ ???????????ajaxRe.abort() ???????????$("#upfile").val("") ???????????$("#loading_upload").hide(20); ????????}

jquery获取上传进度和取消上传操作

原文地址:https://www.cnblogs.com/shuaihan/p/9443883.html

知识推荐

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