HTML5+Downloader文件下載

時間 2019-11-19

標籤 html5+downloader html downloader 文件下載欄目 HTML 简体版

原文原文鏈接

Downloader模塊管理網絡文件下載任務，用於從服務器下載各類文件，並支持跨域訪問操做。經過plus.downloader獲取下載管理對象。Downloader下載使用HTTP的GET/POST方式請求下載文件，符合標準HTTP/HTTPS傳輸協議。javascript

步驟：css

1.建立下載對象html

2.監聽狀態java

3.開始下載

完整演示代碼跨域

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <script src="js/mui.min.js"></script> <link href="css/mui.min.css" rel="stylesheet"/> </head> <body> <header class="mui-bar mui-bar-nav"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <h1 class="mui-title">hello</h1> </header> <div class="mui-content"> <div style="padding:20px;"> <div style="line-height:38px;" id="dstatus">下載狀態</div> <div class="mui-progressbar" id="psb1"> <span></span> </div> </div> <div style="padding:20px;"> <button id="download" onclick="createDownload();" class="mui-btn-blue mui-pull-right">開始下載</button> <button id="download" onclick="cDownload();" class="mui-btn-red mui-pull-right" style="margin-right:10px;">取消下載</button> </div> </div> <script> mui.init(); //初始化下載對象 var dtask = null; var psb1 = mui('#psb1'); var dstatus = mui('#dstatus'); function createDownload(){ var isFile1 = false; //判斷文件是否已經下載 plus.io.resolveLocalFileSystemURL( '_downloads/Snip_V2.0_5771.dmg', function(entry){ if(entry.isFile){ mui.toast('已經下載'); } }, function(e){dBase();} ); } function dBase(){ if(dtask){mui.toast('下載任務已經存在'); return;} dtask = plus.downloader.createDownload( //建立下載任務 'http://snip.qq.com/resources/Snip_V2.0_5771.dmg', {method:"GET"}, //下載完成執行的回調函數 function(d, status){ mui.toast(d.filename); } ); dtask.addEventListener("statechanged", function(task,status){ //監聽下載任務 if(!dtask){return;} switch(task.state) { case 1: // 開始 mui.toast("開始下載..."); break; case 2: // 已鏈接到服務器 mui.toast( "連接到服務器..."); break; case 3: // 已接收到數據 var progressVal = (task.downloadedSize/task.totalSize)*100; psb1.progressbar({progress:progressVal}).show(); dstatus[0].innerHTML = task.downloadedSize+'/'+task.totalSize; break; case 4: // 下載完成 //mui.toast( "下載完成！"); break; } }); dtask.start(); //開始下載 } function cDownload(){ if(!dtask){mui.toast('請先開始下載'); return;} dtask.abort(); dtask = null; } </script> </body> <script type="text/javascript"> </script> </html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。