HTML

<img src="img/[email protected]" onclick="browerfile.click()" id="QRCode" />
<input type="file" id="browerfile" style="display: none;" class="test">

JavaScript

var img = '';

	function b64EncodeUnicode(str) {
		return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function (match, p1) {
			return String.fromCharCode('0x' + p1);
		}));
	}
	//獲取圖片路徑的方法，相容多種瀏覽器，通過createObjectURL實現
	function getObjectURL(file) {
		var url = null;
		if (window.createObjectURL != undefined) {
			url = window.createObjectURL(file); //basic
		} else if (window.URL != undefined) {
			url = window.URL.createObjectURL(file);
		} else if (window.webkitURL != undefined) {
			url = window.webkitURL.createObjectURL(file);
		}

		return url;
	}
	//實現上上傳圖片功能程式碼
	$(function () {
		$("#browerfile").change(function (e) {
			var path = browerfile.value;
			var objUrl = getObjectURL(this.files[0]);
			if (objUrl) {
				$('#QRCode').attr("src", objUrl);
			}
			var file = e.target.files[0];
			var reader = new FileReader();
			reader.readAsDataURL(file); // 讀出 base64
			reader.onloadend = function () {
				// 圖片的 base64 格式, 可以直接當成 img 的 src 屬性值        
				img = reader.result;
				// 下面邏輯處理
			};
		})
	})
 

注意：

<input type="file" accept="image/*;capture=camera">直接呼叫相機
<input type="file" accept="image/*" />呼叫相機 圖片或者相簿