使用百度webuploader外掛進行多檔案型別分片上傳例項

阿新 • • 發佈：2019-01-27

jQuery(function() { function e(e) { var a = o('<li id="' + e.id + '">' + e.name + '</li>'), s = o('<div class="file-panel">刪除向右旋轉向左旋轉</div>'

).appendTo(a), i = a.find("p.progress span"), t = a.find("p.imgWrap"), r = o(''), d = function(e) { switch (e) { case "exceed_size": text = "檔案大小超出"

; break; case "interrupt": text = "上傳暫停"; break; default: text = "上傳失敗，請重試" } r.text(text).appendTo(a) }; "invalid"

=== e.getStatus() ? d(e.statusText) : (t.text("預覽中"), n.makeThumb(e, function(e, a) { if (e) return void t.text("不能預覽"); var s = o('<img src="' + a + '">'); t.empty().append(s) }, v, b), w[e.id] = [e.size, 0], e.rotation = 0), e.on("statuschange", function(t, n) { "progress" === n ? i.hide().width(0) : "queued" === n && (a.off("mouseenter mouseleave"), s.remove()), "error" === t || "invalid" === t ? (console.log(e.statusText), d(e.statusText), w[e.id][1] = 1) : "interrupt" === t ? d("interrupt") : "queued" === t ? w[e.id][1] = 0 : "progress" === t ? (r.remove(), i.css("display", "block")) : "complete" === t && a.append(''), a.removeClass("state-" + n).addClass("state-" + t) }), a.on("mouseenter", function() { s.stop().animate({ height: 30 }) }), a.on("mouseleave", function() { s.stop().animate({ height: 0 }) }), s.on("click", "span", function() { var a, s = o(this).index(); switch (s) { case 0: return void n.removeFile(e); case 1: e.rotation += 90; break; case 2: e.rotation -= 90 } x ? (a = "rotate(" + e.rotation + "deg)", t.css({ "-webkit-transform": a, "-mos-transform": a, "-o-transform": a, transform: a })) : t.css("filter", "progid:DXImageTransform.Microsoft.BasicImage(rotation=" + ~~ (e.rotation / 90 % 4 + 4) % 4 + ")") }), a.appendTo(l) } function a(e) { var a = o("#" + e.id); delete w[e.id], s(), a.off().find(".file-panel").off().end().remove() } function s() { var e, a = 0, s = 0, t = f.children(); o.each(w, function(e, i) { s += i[0], a += i[0] * i[1] }), e = s ? a / s : 0, t.eq(0).text(Math.round(100 * e) + "%"), t.eq(1).css("width", Math.round(100 * e) + "%"), i() } function i() { var e, a = ""; "ready" === k ? a = "選中" + m + "張檔案，共" + WebUploader.formatSize(h) + "。" : "confirm" === k ? (e = n.getStats(), e.uploadFailNum && (a = "已成功上傳" + e.successNum + "張照片至XX相簿，" + e.uploadFailNum + '張照片上傳失敗，<a class="retry" href="#">重新上傳</a>失敗檔案或<a class="ignore" href="#">忽略</a>')) : (e = n.getStats(), a = "共" + m + "張（" + WebUploader.formatSize(h) + "），已上傳" + e.successNum + "張", e.uploadFailNum && (a += "，失敗" + e.uploadFailNum + "張")), p.html(a) } function t(e) { var a; if (e !== k) { switch (c.removeClass("state-" + k), c.addClass("state-" + e), k = e) { case "pedding": u.removeClass("element-invisible"), l.parent().removeClass("filled"), l.hide(), d.addClass("element-invisible"), n.refresh(); break; case "ready": u.addClass("element-invisible"), o("#filePicker2").removeClass("element-invisible"), l.parent().addClass("filled"), l.show(), d.removeClass("element-invisible"), n.refresh(); break; case "uploading": o("#filePicker2").addClass("element-invisible"), f.show(), c.text("暫停上傳"); break; case "paused": f.show(), c.text("繼續上傳"); break; case "confirm": if (f.hide(), c.text("開始上傳").addClass("disabled"), a = n.getStats(), a.successNum && !a.uploadFailNum) return void t("finish"); break; case "finish": a = n.getStats(), a.successNum ? swal('上傳成功!') : (k = "done", location.reload()),c.hide(),location.reload() } i() } } var n, o = jQuery, r = o("#uploader"), l = o('<ul class="filelist"></ul>').appendTo(r.find(".queueList")), d = r.find(".statusBar"), p = d.find(".info"), c = r.find(".uploadBtn"), u = r.find(".placeholder"), f = d.find(".progress").hide(), m = 0, h = 0, g = window.devicePixelRatio || 1, v = 110 * g, b = 110 * g, k = "pedding", w = {}, x = function() { var e = document.createElement("p").style, a = "transition" in e || "WebkitTransition" in e || "MozTransition" in e || "msTransition" in e || "OTransition" in e; return e = null, a }(); if (!WebUploader.Uploader.support()) throw alert("Web Uploader 不支援您的瀏覽器！如果你使用的是IE瀏覽器，請嘗試升級 flash 播放器"), new Error("WebUploader does not support the browser you are using."); n = WebUploader.create({ pick: { id: "#filePicker", label: "點選選擇檔案" }, dnd: "#uploader .queueList", paste: document.body, accept: { title: 'Files', extensions: 'gif,jpg,jpeg,bmp,png,pdf,doc,docx,txt,xls,xlsx,ppt,pptx,zip,mp3,mp4,text,csv', mimeTypes: 'image/*,text/*' //word +',application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document' //excel +',application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' //ppt +',application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation' +',application/pdf' +',application/zip' +',application/csv' }, swf: BASE_URL + "/Uploader.swf", disableGlobalDnd: !0, chunked: !0, server: BASE_URL +"/fileupload.php", fileNumLimit: 300, fileSizeLimit: 5242880, fileSingleSizeLimit: 1048576 }), n.addButton({ id: "#filePicker2", label: "繼續新增" }), n.onUploadProgress = function(e, a) { var i = o("#" + e.id), t = i.find(".progress span"); t.css("width", 100 * a + "%"), w[e.id][1] = a, s() }, n.onFileQueued = function(a) { m++, h += a.size, 1 === m && (u.addClass("element-invisible"), d.show()), e(a), t("ready"), s() }, n.onFileDequeued = function(e) { m--, h -= e.size, m || t("pedding"), a(e), s() }, n.on("all", function(e) { switch (e) { case "uploadFinished": t("confirm"); break; case "startUpload": t("uploading"); break; case "stopUpload": t("paused") } }), n.onError = function() { swal('操作失敗!',"錯誤：檔案型別不符、新增的檔案有重複、位元組超大！", "warning"); }, c.on("click", function() { return o(this).hasClass("disabled") ? !1 : void("ready" === k ? n.upload() : "paused" === k ? n.upload() : "uploading" === k && n.stop()) }), p.on("click", ".retry", function() { n.retry() }), p.on("click", ".ignore", function() { $.fancybox.close(); }), c.addClass("state-" + k), s(),n.on("uploadSuccess",function(file,ret) { $.post("/team-dzone-event.html",{name:ret.oldName,path:ret.filePath,type:ret.fileSuffixes}); }) });

使用百度webuploader外掛進行多檔案型別分片上傳例項

使用百度webuploader外掛進行多檔案型別分片上傳例項

百度WebUploader外掛中加入自定義引數+struts框架

webuploader 檔案上傳外掛 IE8/9 檔案選擇不上傳

百度——個人雲端儲存pcs——Android使用百度雲盤(2)——建立資料夾和上傳檔案

jquery ajax 多檔案Excel解析上傳

ssm+maven專案中加入“百度富文字編輯器”，實現圖片上傳

多檔案預覽上傳基於Struts

MVC3.0下使用百度富文字編輯器ueditor1.3.6上傳圖片

Javascript與asp.net 實現Ajax多檔案無重新整理上傳

百度Ueditor的基本配置和照片的上傳

Bootstrap fileInput多檔案同步非同步上傳(C#)

bootstrap多檔案預覽上傳

大檔案資料分片上傳簡單示例

使用xUtils3和RandomAccessFile來實現檔案的分片上傳

webuploader多圖上傳，webuploader多檔案上傳，百度webuploader批量非同步上傳檔案

Idea中使用Springboot和webuploader外掛進行檔案上傳

使用百度webuploader實現大檔案上傳

百度WebUploader上傳圖片，圖片回顯編輯，查看

百度地圖之九如何在一個地圖上顯示多條導航路線

百度webuploader如何實現秒傳與斷點續傳

使用百度webuploader外掛進行多檔案型別分片上傳例項

相關推薦