1. 程式人生 > >拍照上傳,從相簿選擇上傳

拍照上傳,從相簿選擇上傳

<!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>