php教程|PHP开发
jquery bigfileupload 文件上传 进度条
php教程-PHP开发
实现方法：用到了高山来客 的bigfileupload组件，用高山来客的方法，弹出一个模式窗口，然后不停刷新获取进度，始终觉得体验感不好，于是想到用jquery来实现无刷新进度显示，因为提交页面后， 不能让其刷新页面，而是要不断地通过ajax获取progress.aspx返回的进度信息,所以用到了jquery.form的ajaxform提交。ajaxform提交后如果执行提交后的事件，比如在数据库里插入记录，还在调试中。
查看小游戏源码,ubuntu 下载到本地,彻底删除tomcat6服务,爬虫挂号网,php制作比赛计分系统,vue框架seolzw
1、用到了jquery 的 progressbar 、form、MultFile及相关组件
欢乐夹娃娃 红包游戏源码,删除双系统ubuntu,Python爬虫教学推荐,毫秒 PHP,中山seo整站lzw
yy电影频道源码,vscode新建web,ubuntu系统应用入门,tomcat配置调试,sqlite声明变量赋值,jquery 小时插件,css前端需要框架么,rpa 发爬虫,apache 与php,seo 年薪,网站源码banjia,前端网页设计模板下载,织梦网络建站模板下载,淘宝简单页面代码下载,基于jsp的图书管理系统设计与实现,java开发客户端程序lzw
2.uploadfile.js代码如下：
$(function() { var info =
; info +=
正在上传:
; info +=
上传速度:
; info +=
状态:
; info +=
预计剩余时间:
; info +=
上传文件大小:
; info +=
已上传大小:
; info +=
‘; info += ‘
‘; $(“body”).append(info); //进度条 $(“#uploadprogressbar”).progressbar(); //上传 $(‘#fileupload’).MultiFile(); $(‘#btshow’).click(function() { alert($(“body”).html()); }); //提交 $(‘#btnsubmit’).click(function() { $(“#uploadForm”).ajaxSubmit( { dataType: ‘text’, beforeSubmit: function(a,f,o) { startProgress(); }, async:false, success: function(data) { //$(“#dialogsucc”).text(data); //stopProgress(); if(data.succ==1) { /* $(“#dialogsucc”).show(); $(“#dialogsucc”).dialog( { modal: true, overlay: { opacity: 0.5, background: “black” } }); */} }, error:function(err) { alert(err); } }); }); }); function getProgress(){ $.ajax({ type: “post”, dataType:”json”, url: “uploadProgress.aspx”, data: “UploadID=” + $(“#UploadID”).val(), success: function(data){ $(“#uploadprogressbar”).progressbar(“progress”, data.percent); $(“#uploadfilename”).html(data.filename); $(“#uploadrate”).html(data.rate); $(“#uploadtitle”).html(data.info); $(“#uploadlefttime”).html(data.lefttime); $(“#uploadtotal”).html(data.total); $(“#uploadcurrent”).html(data.current); if(data.succ==-1){ alert(data.errmsg); } if (data.succ==0){ setTimeout(“getProgress()”, 1000); } if (data.succ==1){ return; } }, error:function(msg) { alert(msg); } }); } function startProgress(){ $(“#uploadinfo”).show(); setTimeout(“getProgress()”, 500); } function stopProgress() { $(“#uploadinfo”).hide(); }
3:progress.aspx代码如下:
protected void Page_Load(object sender, EventArgs e) { try{ string s = "{"; UploadContext upload = UploadContextFactory.GetUploadContext(Request["UploadID"]); //初始化 if (upload.Status == uploadStatus.Initializing) { s += responeJSON(upload, "0", ""); } if (upload.Status == uploadStatus.Uploading) { s += responeJSON(upload, "0", ""); } if (upload.Status == plete) { s += responeJSON(upload, "1", ""); } if (upload.Status == uploadStatus.HasError) { s += responeJSON(upload, "-1", ""); } s += "}"; Response.Write(s); } catch (Exception err) { //throw err; Response.Write("{info:\" + err.Message.Replace("\", "") + ",succ:-1}"); } } private string responeJSON(UploadContext upload, string succ,string errmsg) { string s = ""; s += "info:\" + upload.FormatStatus + "\" ; s += ",percent:\" + Convert.ToInt32((upload.Readedlength * 100.0 / upload.TotalLength)).ToString() + "\"; s += ",current:\" + (upload.Readedlength/1024).ToString() + "KB\"; s += ", otal:\" + (upload.TotalLength/1024).ToString() + "KB\"; s += ", ate:\" + upload.FormatRatio + "\"; s += ",filename:\" + upload.CurrentFile + "\"; s += ",cancel_upload:" + 0 ; s += ",lefttime:\" + upload.LeftTime + "\"; s += ",succ:" + succ; s += ",errmsg:\" + errmsg +"\"; return s; }
4.ajaxForm执行后，能够正常运行，那上传文件后，我如何执行其它操作，研究完了再发
以上所述是小编给大家介绍的Jquery和BigFileUpload实现大文件上传及进度条显示，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对PHP中文网的支持！
更多Jquery和BigFileUpload实现大文件上传及进度条显示相关文章请关注PHP中文网！
