拍照上傳，從相簿選擇上傳
阿新 • • 發佈：2018-12-29
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link href="css/mui.min.css" rel="stylesheet" /> <script src="js/mui.min.js"></script> <script src="js/jquery.min.js"></script> <style> .imageup { width: 100px; height: 36px; line-height: 36px; } .button { width: 100px; height: 50px; line-height: 50px; } </style> </head> <body> <img id="headimg" src='' height="150" width="150"> <p> <a href="javascript:;" class="imageup">上傳圖片</a> </p> <p><button onclick="upload();" class='button'> 提交</button></p> <script> function plusReady() { // 彈出系統選擇按鈕框 mui("body").on("tap", ".imageup", function() { page.imgUp(); }) } var page = null; page = { imgUp: function() { var m = this; plus.nativeUI.actionSheet({ cancel: "取消", buttons: [{ title: "拍照" }, { title: "從相簿中選擇" } ] }, function(e) { //1 是拍照 2 從相簿中選擇 switch(e.index) { case 1: appendByCamera(); break; case 2: appendByGallery(); break; } }); } } // 拍照新增檔案 function appendByCamera() { plus.camera.getCamera().captureImage(function(e) { console.log(e); plus.io.resolveLocalFileSystemURL(e, function(entry) { var path = entry.toLocalURL(); //console.log(path); document.getElementById("headimg").src = path; //就是這裡www.bcty365.com }, function(e) { mui.toast("讀取拍照檔案錯誤：" + e.message); }); }); } // 從相簿新增檔案 function appendByGallery() { plus.gallery.pick(function(path) { document.getElementById("headimg").src = path; }); } //服務端介面路徑 var url = "http://192.168.3.77/2018323/index.php"; //獲取圖片元素 var files = document.getElementById('headimg'); // 上傳檔案 function upload() { console.log(files.src); var wt = plus.nativeUI.showWaiting(); var task = plus.uploader.createUpload(url, { method: "POST" }, function(t, status) { //上傳完成 if(status == 200) { alert("上傳成功：" + t.responseText); wt.close(); //關閉等待提示按鈕 } else { alert("上傳失敗：" + status); wt.close(); //關閉等待提示按鈕 } } ); //新增其他引數 task.addData("name", "test"); task.addFile(files.src, { key: "dddd" }); task.start(); } if(window.plus) { plusReady(); } else { document.addEventListener("plusready", plusReady, false); } </script> </body> </html>